Mendapatkan Bagian Halaman Web Secara Parsing

Ide ini bermula dari pengalaman saya saat mengikuti Hack Nation yang diselenggarakan oleh Nokia. Saat itu saya dan partner saya (@ansharabdullah) ingin membuat aplikasi jadwal sholat. Sepertinya aplikasi yang simpel ya?

Tidak Sesimpel Itu Juga Sih...

Namun masalahnya kami tidak memiliki API jadwal sholat maupun algoritma dan metode lain untuk menentukan jadwal sholat. Lagipula bila menghitung sendiri belum tentu yang saya buat akan sesuai standar dari menteri agama, ya? :). Satu-satunya informasi yang saya ketahui adalah jadwal sholat bisa dilihat di website PKPU.

Alamat aplikasi generator jadwal sholat ada di http://www.pkpu.or.id/adzan3/monthly.php?id=10.

Thanks berat buat cahyadsn yang telah membuat app ini.

Nah, kita sudah memiliki halaman yang memiliki jadwal sholat, berarti secara teori sudah ada data sholat yang bisa diambil. Namun bagaimana caranya mengambil data dari salah satu bagian halaman tersebut untuk digunakan lagi?

Halaman Web Adalah Teks

Secara konkrit, webpage dibuat oleh html yang merupakan teks. Berarti kita dapat menelusuri teks tersebut dan memilah untuk mengambil bagian yang kita inginkan saja bukan? Metode pencarian untuk menentukan susunan pola dan gramatika ini disebut dengan parsing. 

Dalam implementasinya hal ini dapat dilakukan salah satunya dengan Javascript. Kenapa Javascript? Karena kebetulan saat acara Hack Nation saya dan partner membuat web app yang menggunakan Javascript sebagai bahasa pemrogramannya, itu artinya sobat juga bisa menggunakan bahasa lain dengan metode yang sama.

Mengambil Bagian Halaman

Kembali di halaman PKPU. Dalam halaman jadwal sholat yang diberikan ini terdapat sebuah tabel yang berisi jadwal sholat. Dengan inilah saya mengambil pola dari pembentukan tabel tersebut. Bagi sobat yang mengetahui tag html, tabel akan dimulai dengan tag table dan diikuti serangkaian tag tr dan td. Ini merupakan bagian yang menguntungkan bagi saya karena setiap data telah dipisah-pisah secara rapi dengan tabel. Yang tinggal saya lakukan adalah membuang tabelnya dan mengambil data di dalamnya.

Metode yang saya gunakan untuk mengambil bagian halaman tersebut sangat sederhana! Saya hanya mengecek sesuai dengan pola halaman tersebut dengan menggunakan teknik AJAX.

Inilah Implementasinya

Berikut implementasi dari pengambilan bagian halaman yang ada di web.

//kode //kode

Penggunaan kode ini dapat dilakukan dengan menggunakan onload="jadwalSholat.connect(14,23)", dimana 14 sebenarnya adalah kode dari kota dan 23 adalah tanggal sekarang. Kode kota bisa sobat dapatkan dari dropdown list yang ada di website PKPU.

Ini Berbahaya

Mungkin sobat sudah mencobanya dan tidak ada data yang di load? Teknik AJAX dengan memanggil dari domain lain sangatlah berbahaya. Teknik ini sering digunakan pula oleh hacker dengan sebutan Cross-Site Scripting. Bagi teman-teman kita yang jahat, mereka dapat mengaktifkan beragam fungsi dari website lain untuk dibuka di website yang lainnya lagi.

Saat saya mencoba script ini di Chrome pesan error di Console ditampilkan, namun saya bisa menjalankannya di Safari. Aneh juga ya?

Dari berbagai sumber dan forum yang saya dapat bahkan untuk beberapa server tidak diperkenankan untuk memanggil AJAX dengan domain host berbeda. Namun karena saat itu saya develop untuk Web App dan yang mengatur pemanggilan data adalah dari server Nokia, hasilnya lancar saja kok :)

Itulah caranya

Walaupun tidak mendapatkan juara di Hack Nation saat itu namun saya sangat senang dapat bertemu dengan metode seperti ini. Bayangkan untuk kegunaan apa lagi yang bisa sobat lakukan dengan teknik ini? It's fun!