Menggunakan Chrome DevTools Untuk Kebutuhan Crawling dengan Network Debugging
Chrome DevTools adalah satu set alat untuk menulis dan men-debug web yang menjadi bawaan Google Chrome.
Dalam kesempatan ini saya akan membahas terkait tentang menggunakan Chrome DevTool untuk Mendapatkan XHR atau XmlHttpRequest yang merupakan WebApi yang ada di browser modern, AJAX merupakan sebuah metode yang melakukan transaksi rahasia dibelakang anda untuk membuat anda secara tidak sadar menerima respond dari server.
Dalam contoh kali ini saya akan memberikan contoh penggunaan Network Debugging untuk Keperluan Crawling XHR dalam bentuk json.
Disini saya berniat untuk melakukan crawling untuk mendapatkan data Sosial,Kependudukan,Ekonomi,Perdagangan,Pertanian dan Pertambangan.
Tujuan :
Tujuan dari yang akan kita lakukan adalah melakukan Crawling Table Data secara Otomatis Untuk Semua Kategori dari data BPS Tematik Interaktif
Data diatas merupakan salah satu sample data yang akan kita ambil,
dimana kita memerlukan semua data dari berbagai kategori yang perlu kita dapatkan
Tahap Persiapan :
- Browser Chrome
- Python3
- Jupyter Notebook
- Library Pandas
Website :
https://sig.bps.go.id/webgis/tematik-interaktif
1.Membuka Chrome Developer Mode
“Untuk Membuka Developer Mode Kita dapat menggunakan
Shortcut Ctrl + Shift + I Pada Windows
atau
Cmd+Opt+I Pada Mac
atau
dengan Klik kanan pada browser ,lalu Klik Inspect”
Setelah itu kita menuju ke tab Network Untuk Melihat Lalulintas Jaringan yang terjadi
2.Mendapatkan XHR Request
Setelah Kita Membukan Tab Network pada Developer Mode,
selanjutna kita perlu melakukan request baru dengan memilih data yang ingin kita ambil,disini saya memilih data inflasi berdasarkan publik perbulan
Setelah kita melakukan request,
maka kita akan mendapatkan informasi terkait request yang terjadi,kemana request ditujukan,dan respon yang diberikan
Disini kita dapat melihat detail request dan respon terhadap request tersebut
Dari header tersebut kita dapat mendapatkan informasi bahwa request diberikan dengan mengakses ker URL :
https://sig.bps.go.id/rest/getdataseries?getdatadetail=531
dan mendapatkan status OK
kita juga dapat melihat Preview data yang kita terima dengan menuju ke tab Preview
Kita juga dapat melakukan Akses Ke WEB API tersebut
Dari URL
https://sig.bps.go.id/rest/getdatadetail?id=531
Kita Dapat menarik kesimpulan bahwa id=531
adalah ID untuk judul data yang diambil
Langkah Berikutnya adalah melakukan Request tabel data
dengan menekan button hijau
Lalu kita akan menerima request baru,berupa request untuk mendapatkan data dari tabel
Berikut adalah URL Request Tersebut
Lalu Output jika kita membuka URL Tersebut adalah JSON untuk tabel tersebut
Dari kedua Web API Tersebut Kita dapat mengambil Kesimpulan bahwa :
1.Untuk WebApi Pertama kita memerlukan 1 parameter yaitu ID untuk Mendapatkan informasi data series untuk digunakan pada WebApi kedua
2.Untuk WebApi kedua kita memerlukan 2 parameter yaitu Parameter data_id yang merupakan sama dengan parameter WebApi pertama dan juga series_id yang bisa didapatkan dengan informasi dari WebApi pertama
Setelah kita mendapatkan kesimpulan atau alur logika dari kedua WebApi Tersebut,Kita dapat melakukan Crawling data ,disini saya menggunakan Python3.
3.Crawling WebApi
Berikut Adalah SourceCode untuk Melakukan Crawling :
Refrensi :