Browsed by
Category: Uncategorized

Tanda situs di hack atau diretas oleh hacking

Tanda situs di hack atau diretas oleh hacking

Tanda tanda website korban pemerkosaan eh… salah ding… peretasan maksudnya ¬†ūüėõ

Seminggu belakang ini salah satu website yang dikelola oleh share-system.com telah menjadi korban hacker atau peretasan. Dampaknya adalah rangking di google tiba-tiba saja menurun drastis serta banyak kehilangan visitor. Hacker ini cukup cerdas tidak menggunakan korban untuk mendeface website tersebut tapi memanfaatkannya untuk meningkatkan rangking situs tertentu. Metode ini diistilahkan oleh google sebagai metode cloaking.

Nah disini kita tidak membahas tentang korban deface ya… (atau penggantian tampilan situs menjadi yang dikehendaki oleh hacker seperti ini.

system-domain-kena-hack

 

Sebelum beranjak ke metode hack yang dilakukan oleh hacker mari kita pahami dulu apa itu beberapa dampak dari situs yang dihack selain di deface lho…..

Cloaking, Apa itu cloaking ?

A website that uses cloaking recognizes search engine spiders by their IP address. It returns web pages to search engine spiders that are different from the web pages that web surfers see. Usually, the cloaking software creates hundreds of web pages that are optimized for a special search term so that search engine spiders get the impression that the website contains a lot of relevant information about a special topic. (source)

 

tujuan cloaking adalah meningkatkan hasil rangking dari search engine seperti google atau bing.com. situs yang menjadi korban cloaking akan menampilkan hasil yang berbeda antara user dengan tipikal organic user (user manusia) dan bot search engine (seperti Googlebot).

 

Hasil yang ditampilkan ke user Hasil dari query Bot

 

Bagaimana bisa dibayangkan dengan injeksi script tersebut akan mencederai rangking situs kita dimana seringkali hasil incoming / traffic dating dari search engine bukan dari direct link. Pengguna ingin mencari ‚ÄúPlugin sering dipakai di sublime text‚ÄĚ yang muncul bahasa planet seperti diatas‚Ķ wwkwkk mimpi aja klo pengguna mau klik link diatas.

 

ini lebih jelasnya yang diterawang oleh mbah google coba kettikan site:domainanda.com

 

CryptoCurrency Miner

Oh iya hacker selain memanfaatkan situs korban sebagai cloaking juga bisa mengexploitasi sebagai sumber daya penambang cryptocurrency seperti yang dilaporkan oleh katadata.com

korban cypto miner ini mengakibatkan situs anda apabila diakses oleh klien menjadi lambat.. bukan situsnya yang lambat tapi komputer / sumber daya klien yang jadi lambat karena cpu, memory, listriknya dipakai oleh hacker buat jadi bahan nyari lotre  cyprocurrency.

 

Tanda tanda situs anda korban hacking / peretasan

Beberapa tanda-tanda peretasan hacker adalah adanya email dari google terhadap adanya user baru di search console anda. Search console google adalah fasilitas yang disediakan oleh google bagi web master / pengelola situs untuk mendaftarkan situs kita agar dapat lebih cepat di index oleh google.  Oh iya notifikasi dibawah ini tidak akan anda peroleh apabila anda sebagai webmaster tidak pernah mendaftarkan di indeksasi search console google.

Berikut tampilan search console :

Nah bagaimana sih caranya si peretas dapat menambahkan user di halaman website yang seharusnya bukan miliknya. Hacker telah memasang backdoor di situs korban dan menambahkan token yang dihasilkan oleh google di halaman tersebut sebagai file verifikasi oleh google. Untungnya google akan mengemail aktivitas tersebut ke email yang telah kita daftarkan sehigga kita dapat langsung tahu adanya aktivitas yang mencurigakan di akun google tersebut. Sayangnya karena ini baru pertama kena hack gua ga paham apa yang mesti dilakukan setelah dapat notifikasi tersebut… wkwkwkk. Wajar lah… situsnya kan masih perawan jadi masih belum pernah kena hack hehe.

Dan beberapa hari berikutnya google search console akan melaporkan adanya halaman yang menghasilkan kode ‚Äú404‚ÄĚ atau tidak ditemukan / missing link.

Di menu kesalahan perayapan / error crawl akan muncul tampilan berikut :

 

Dari pemaparan diatas anda bukan siaga lagi tapi mesti melakukan tindakan nyata mencari celah dimana hacker memasang pintu belakang di halaman situs anda. Untuk mendeteksi bagaimana mengetahui adanya backdoor dan menutup celah kembalinya terulang masalah tersebut dapat membaca artikel berikutnya.

Deteksi kelemahan web begini caranya.

 

Klo ada yang kawan2 ketahui yang tidak dijelaskan disini mohon sharing di komentar ya bro.

Membuat form html posting ke telegram

Membuat form html posting ke telegram

Mungkin bro pernah mengalami ingin membuat form di html dan tanpa ribet-ribet ga pengen bikin database buat nampung form tersebut.
Selain menampung ke database bisa Mysql – MariaDB atau apa aja lah… hasil form juga ribet kan mesti diperiksa manual dengan membuka aplikasi dulu…

Nah sekarang kan zamannya keterbukaan (open access) kenapa ga memanfaatin layanan pihak ketiga aja ya…
Layanan pihak ketiga bisa menggunakan misalnya emailing dengan memanfaatkan php_mailer dari php atau layanan lainnya seperti api dari telegram atau  WA (ga terbuka banget sih WA mengenai keterbukaan akses mereka jadi ini ga rekomended).

Pada awalnya saya udah memanfaatkan email sistem (gmail) untuk menampung dan menerima hasil isian form HTML namun sepertinya layanan gmail cukup ketat dan berdasarkan pengalaman apabila anda merubah hosting maka tentunya akan diblokir oleh Google terhadap akses ke pengiriman emailnya.. (walah repot jadinya ada klien menuliskan pesan ternyata ga sampai-sampai deh). Pemblokiran akses pengiriman email ini tidak hanya apabila ada perubahan IP namun  dari aktivitas yang mencurigakan oleh Google. Dengan menggunkan sistem emailing ini sepertinya kurang handal diterapkan.

Artikel ini akan membahas metode kedua yakni memanfaatkan Api (Application Programming Interface) yang disediakan oleh telegram melalui bot.

untuk menerapkannya anda bisa baca dulu referensi bot telegram disini
Perlu diperhatikan bahwa metode akses API disini menggunakan polling bukan webhooks… nah apa sih perbedaaan dua metode tersebut, akang yohanes sudah mengajari kita disini untuk lebih jelasnya buka ya guys

Berikut langkah perlangkahnya… tenang aja guys ga rumit ko….

1.  Buat dulu botnya, minta permisi dulu sama bosnya bot alias BotFather caranya :

2. ketikan /start pada BotFather

3. Buat bot baru …. lihat dibawah ini perintahnya :

4. Sekarang tambahkan bot tadi sebagai teman anda ya…

5. Ketikkan perintah berikut ini :

6. Sekarang bisa deh kita akses pesan tersebut yang diterima oleh bot dengan arahkan browser anda ke url ini :
https://api.telegram.org/botTokenBotAnda/getUpdates

makan akan menghasilkan data json sebagai berikut :

{"ok":true,"result":[{"update_id":301413893,
"message":{"message_id":3,"from":{"id":xxxxxx,"is_bot":false,"first_name":"muhammad","last_name":"hendra","username":"muhammad_hendra","language_code":"en"},"chat":{"id":xxxxxx,"first_name":"muhammad","last_name":"hendra","username":"muhammad_hendra","type":"private"},"date":1510796658,"text":"fafafa"}}

nah yang perlu bro perhatikan dan simpan adalah nilai chat_id di data json diatas. Dari nilai chat_id tersebutlah kita bisa mengkoneksikan form html kita dengan telegram.

sekarang tinggal tuliskan koding php berikut :

Koding php telegram api
 
  1. //File Name telegram_post.php
  2. $email = $_POST['email'];
  3. $pesan = $_POST['pesan'];
  4. $date = date('d F Y').'%0A';
  5. $message = $date.'Bro ada pesan ni di share-system.com dari '.$email.' : %0A'.$pesan.'';
  6. $api = 'https://api.telegram.org/botTokenBotAnda/sendMessage?chat_id=xxxx&text='.$message.'';
  7. $ch = curl_init($api);
  8. curl_setopt($ch, CURLOPT_HEADER, false);
  9. curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
  10. curl_setopt($ch, CURLOPT_POST, 1);
  11. curl_setopt($ch, CURLOPT_POSTFIELDS, ($params));
  12. curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
  13. $result = curl_exec($ch);
  14. curl_close($ch);
  15. var_dump($api);

Jangan lupa ya guys buat form HTMLnya… dan jangan lupa coba klo ada error silahkan komentar ya.. biar kita sama-sama diskusikan (pelit coding ¬†ūüėõ )

oke guys karena gua lagi baik nih form htmlnya… ya… :

 
 
  1. <form action="telegram_post.php" method="post" data-form-title="MESSAGE" id="frmpesan">
  2. <input type="hidden" value="nWmyXojkFcrwN18JgVE77mVh1UhMHd/Lk3kD63XTVSh/kwfJk0usXWaWvuX4Rwwk5KB0TiZ/FxIpTdXPw7KRS6KDW3m149e/aSLWs6wi97Sm2e13G9wjVfLESYXg0SvX" data-form-email="true">
  3. <div class="form-group" align="center" style="margin-bottom: 0; padding-top: 8px;">
  4. <h5>Kontak Kami Sekarang Juga</h5>
  5. </div>
  6. <div class="form-group">
  7. <label class="form-control-label" for="contacts3-2l-email">Email<span class="form-asterisk">*</span></label>
  8. <input type="email" class="form-control input-sm input-inverse" name="email" data-form-field="Email" id="contacts3-2l-email" >
  9. </div>
  10. <div class="form-group">
  11. <label class="form-control-label" for="contacts3-2l-message">Pesan<span class="form-asterisk">*</span></label>
  12. <textarea class="form-control input-sm input-inverse" name="message" data-form-field="Message" rows="5" id="contacts3-2l-message"></textarea>
  13. </div>
  14. <div><a href="#" class="btn btn-sm btn-black" id="btnkirim" data-loading-text="<i class='fa fa-spinner fa-spin '></i> Sending Email">Kirim Pesan!</a></div>
  15. </form>

oke guys gampang kan…

Benchmark Sublime Text 3 vs Visual Code

Benchmark Sublime Text 3 vs Visual Code

 

Sebelum kita head to head antara ST3 dan vscode perlu ada pengantar dulu guy, skripsi aja klo ga ada bab 1 dan 3 ga bakal nyampe ke bab 4 lho. Ingikut deh ajaran dosen terdahulu mesti ada pengatar biar asik… hehe…

Sublime Text 3

Sublime text  dikembangkan merupakan editor source code proprietary sejak 18 januari 2008 lalu yang dikembangkan dengan menggunakan Bahasa Pyhton. ST ini mendukung banyak Bahasa pemograman dari bahasa sql, css, php, javascript, java, c++ dan banyak lagi. . Yang paling menarik dari ST3 adalah adanya ekosistem plugin yang sangat berjibun yang dapat dimanfaatkan dengan adanya package control. Namun sayangnya package control ini tidak ada secara default jadi harus di install secara manual lho. Klo pengen tahu plugin apa saja yang perlu bisa cek pada artikel saya yang dituliskan pada blog ini ya guys.

Daftar plugin wajib di Sublime Text 3

.

Sublime text ini karena bersifat proprietary bukan open source (CMIIW) sehingga pengembangannya bukan pada komunitas tapi pada perusahaan  atau developer yang menjual code editor ini yakni Jon Skinner. Dampaknya adalah pengembangannya terkesan lambat klo pengen bukti yang versi 3 aja (Sublime text 3) sampai artikel ini ditulis masih aja versi BETA alias belum stable sejak di rilis pertama dari tanggal 29 January 2013.

Sublime Text 3 is currently in beta. The latest build is 3126.

Last develop :  23 September 2016

 

liat deh di halaman github mereka ga ada source code untuk ST3 ini, mana ada tuh source code mereka dirilis :

 

Vscode

Vs code atau Visual Studio Code merupakan editor koding atau source code editor yang dibangun dan dikembangkan oleh Microsoft diperuntukkan bagi berbagai platform OS. VScode dibuat dengan berdasarkan Electron. Suatu Framework yang digunakan untuk men deploy node.js.

VsCode diumumkan pada tanggal 29 April 2015 oleh Microsoft dan kemudian dirilis dalam lisensi MIT pada tanggan 18 November 2015 yang saat itu di posting di halaman github sebagai open source pada tanggal 14 April 2016.

ini nih halaman github mereka, bisa dilihat berapa banyak yang berkontribusi dalam mengembangkan app ini dan secara rentang waktu app ini pengembangannya sangat aktif (12 Juli 2017).

 

Time to benchmark, let’s go

Jadi benchmark ini tentang closed source dan open source. Waduh terlalu frontal guy.. tujuan artikel ini bukan membandingkan closed source source editor dan open source source editor loh… terlalu luas jika kita membandingkan dua konsep tersebut. Artikel ini cukup agar menjadi referensi dan sebagai catatan artikel ini hanya relevan untuk versi yang penulis tulis saat ini ya ST3 build version 3126 dan Vscode 1.13. dan benchmark ini hanya membahas yang penulis pahami untuk membandingkan tingkat kecepatan dan konsumsi resource dua app ini dengan menggunakan app windows ga tau klo di linux atau MacOS dan ga tau deh klo pakai metode lain yang mungkin pembaca pahami lebih relevan dalam membenchmark.

Ingat ya guys tulisan ini tidak membandingkan yang mana yang paling bagus baik dari segi fitur dan lain sebagainya tapi hanya tulisan pembanding kecepatan saja.

Sebelum kita lanjut melakukan benchmark maka agar fair kita perlu menonaktifkan seluruh plugin yang penulis pasang pada aplikasi sebelum menonaktifkan perlu dulu diketahui paket apa aja yang terpasang berikut paket yang terpasang dan dijelaskan sekalian cara menonaktifkan paket yang ada :

Cara menonaktifkan paket di sublime text 3 yakni :

Gambar :

Letak file sublime.settings : C:\Users\yourName\AppData\Roaming\Sublime Text 3\Packages\User

Screenshot melihat paket aktif

Screen shot setting di ignored package

jadinya begini :

Restart, periksa apakah masih ada paket yang terload misalnya dengan menekan tombol kombinasi ctrl+shift+p . jika tidak ada perintah misalnya kita ketikkan install maka jelas package control telah non aktif.

 

Nah sekarang saatnya kita lakukan Benchmark dengan melihat penggunaan memory dan cpu (screenshot), metode benchmark sangat sederhana cukup dilakukan melalui monitoring task manager :

Dapat dilihat bahwa VScode sangat kecil dalam menggunakan konsumsi memory hanya sekitar 15 MB lebih dikit dan ST3 waduh.. .berapa kali lipatnya Vscode dalam memakai sumber daya 51Mb guys… keterlaluan kau ST3 jadi gara2 kau aku harus upgrade RAM.. wkwkwkw.

Selesai guy. sudah siap move on nih.. hehehe… klo belum siap gpp saya juga ko.. hehehe….

Give your appreciation please share this article bro¬† ūüėÄ Jangan lupa diskusikan apabila ada yang tidak jelas di kolom komentar dibawah ini.

 

Cara membuat floating label dengan javascript

Cara membuat floating label dengan javascript

Pernah kan guys kalian lihat tampilan form dengan format berikut :

Tampilan diatas merupakan tampilan form pada aplikasi android yang seringkali kita temui. Title yang dikasih dengan kode warna itu oren tersebut disebut dengan floating label. User Interface atau tampilan aplikasi dengan menggunakan format label floating / melayang tersebut sangat bermanfaat.  Berikut beberapa manfaatnya :

Pertama element label akan lebih mudah dibaca dan akan lebih ringkas dalam pembuatan form karena developer tidak perlu menambahkan element html di tiap form input.

Kedua, floating label ini akan mempermudah bagi user yang sudah terbiasa bagi interface mobile untuk berinteraksi di app yang dibangun dengan basis web.

Walaupun diantara beberapa kemudahan tersebut, label melayang di tidak bisa dibuat secara mudah. HTML 5 tidak menyediakan secara langsung dukungan terhadap floting label tersebut. Tidak seperti misalnya dukungan terhadap attribut required yang telah didukung oleh HTML 5 dan banyak browser terkini sehingga dengan menambahkan attribut tersebut anda tidak perlu menyertakan library validasi javascript untuk mengecek input yang harus diisi oleh user.

Ada dua cara dalam menerapkan floating label tersebut :

  1. Dengan menambahkan library javascript misalnya yang tersedia di alamat berikut : https://datuhealth.github.io/floating-label/

label floating atau label melayang2.  Membuat sendiri koding floating tabel tersebut dengan javascript dan css.

Disini kita akan membahas langkah 2 yakni membuat sendiri floating label tersebut dengan javascript dan css.

  1. Buat file floating-placeholder.js atau tambahkan coding berikut di halaman html dalam block <script> –disini tambahkan </script>
 
 
/*Addding placeholder floating*/
$(document).on('focus','input.floating_placeholder, select.floating_placeholder, textarea.floating_placeholder ',function(e){
    var placeholder = $(this).attr('placeholder');
    var placeholder_dom = '<span class="floating_placeholder" style="display: none;">'+placeholder+'<span>';
   
    if ($(this).prev('span.floating_placeholder').length != 1) 
    {
        $(this).before(placeholder_dom);
          $(this).prev().css('color', '#535FFC');
         $(this).prev().fadeIn();
    }
    else { 
        //$(this).before(placeholder_dom);
        $(this).prev().css('color', '#535FFC');
         $(this).prev().fadeIn();
       
    }
});
$(document).on('blur','input, select, textarea',function(e){
     $(this).prev('span.floating_placeholder').css('color', '#B4B4B4');
    //$(this).prev('i').css('color', ''); 
});
/*End placeholder floating style*/

 

2. Tuliskan coding css berikut :

 
 
span.floating_placeholder { font-size: 12px; display:block }

 

that’s it silahkan coba sendiri guys….

Apa kamu punya library atau script javascript sendiri… sharing disini dong guys…

 

cara agar script jquery jalan di load ajax

cara agar script jquery jalan di load ajax

yo…¬† pasti deh kita pernah ketemu jika kita pernah menload suatu dom dari hasil eksekusi ajax tapi kok script javascript tidak jalan. misalnya kita mencoba mengeksekusi fungsi tertentu jika ada event di suatu selector/dom. atau misalnya saja kita buat script yang akan menghilangkan suatu element div tertentu tapi ko setelah dari hasil load ajax tidak jalan script / fungsi tersebut. Kita akan membagikan bagaimana trik agar seluruh script yang kita tulis akan dapat berjalan di dom hasil dari dom ajax.

biasanya kita akan menangkap event yang disediakan oleh jquery dengan menggunakan script berikut :

 
 
  1. $(document).ready(function() { 
  2.  $("#someIDdiv").on("click", function(){    
  3.   alert("The paragraph was clicked.");  
  4.  }); 
  5. });

script diatas hanya akan berjalan pada dom yang sudah terload atau script diatas tidak akan jalan jika id #someIDdiv merupakan hasil dari load ajax. Agar script dapat berjalan maka script diatas dapat kita rubah dengan script berikut.

 
 
  1. $(document).on("click", "#someIDdiv", function(e) {
  2. //proses fungsi javascript disini ya bro
  3. });

Demikian atas perhatiannya terima kasih… hahah kaya dokumen resmi aja. sudah bro selamat coding lagi .

"