Tuesday, March 24, 2009

PENGGUNAAN JSON UNTUK PERTUKARAN DATA WEB

XML sudah lama dikenal sebagai format pertukaran data yang banyak digunakan dalam aplikasi web, tetapi bukan berarti satu-satunya. Sekarang, JSON merupakan salah satu alternatif lainnya. Joko Nurjadi
SEDIKIT FLASHBACK awal kelahiran XML, mari kita kembali ke masa akhir tahun 1990-an. Bagi Anda yang sudah mengenal Internet di masa itu, pertukaran data antar-web bisa dibilang sangat minim. Walaupun sudah bertebaran berbagai website di Internet, umumnya mereka saling berdiri sendiri, dalam arti menyimpan datanya masing-masing dan tidak untuk dipertukarkan dengan website lain.
Contohnya sebagai berikut, website A merupakan website berita yang menampilkan berita terkini, kemudian website B ingin mengambil berita yang tampil secara dinamis pada website A, bagaimana caranya? Tentu diperlukan pengiriman data yang berisi berita terbaru dari website A ke website B. Beberapa solusi yang dapat dilakukan website B sebelum teknologi XML dikenal adalah meng-copy manual berita tersebut (sebuah cara yang melelahkan), membuat program pembaca website A yang kemudian mengambil dan memparsing beritanya (sebuah cara yang kompleks), menjalin kerja sama dengan website A dan melakukan sharing/pertukaran database (sebuah cara yang mahal). Untuk pemecahan masalah ini dengan cara yang singkat, sederhana, dan sekaligus murah, XML hadir sebagai solusinya. Dengan format markup language yang fleksibel untuk keperluan apa saja, Anda dapat mendefinisikan elemen data dan melakukan pertukaran data antar-website. Pengembangan-pengembangan XML terus berlanjut hingga kita dapat melihat wajah website dewasa ini, di mana Anda dapat menemukan dengan mudah sebuah blog yang memuat video YouTube, slide gambar dari Flickr, berita, dan lain sebagainya, dengan opsi-opsi pengaturan yang dapat disesuaikan dengan keinginan Anda. Apakah JSON Penggunaan XML memang membawa perubahan yang relatif cepat dan signifikan, tetapi apakah masa kejayaan XML tengah menghadapi tantangan dengan munculnya format baru bernama JSON? JSON (dibaca seperti menyebut nama: Jason) merupakan singkatan dari JavaScript Object Notation. Seperti juga XML, JSON berupa text-based, dan memiliki format yang mudah dibaca. Mungkin tidak akan habisnya membandingkan teknologi lama dan baru karena selalu menimbulkan pro dan kontra. Di lain sisi teknologi terus melaju, termasuk dalam teknologi pertukaran data web. Selain JSON yang berorientasi JavaScript, juga telah dikenal YAML yang mengambil konsep dari berbagai bahasa (XML, C, Perl). Kehadiran sederet markup language/format pertukaran data ini merupakan salah satu cerminan wajah teknologi Internet saat ini, jika dulu bahasa pemrograman (ingat zaman Pascal, Turbo C, kemudian Delphi, Visual Basic) diarahkan untuk menciptakan aplikasi dari awal, maka sekarang bahasa-bahasa seperti XML, JSON lebih diarahkan untuk menjembatani aplikasi-aplikasi agar dapat saling berkomunikasi. Kombinasi JSON dan HTML Kita akan langsung mengaplikasikan JSON dalam coding, untuk itu sebaiknya Anda telah menguasai dasar-dasar HTML/JavaScript, yang tentunya akan mempermudah proses pemahaman. Untuk lebih mengenal bagaimana JSON menerangkan sebuah data, berikut adalah contoh penulisan JSON dalam sebuah file HTML: <html> <head> </head> <body> <script> // JSON var myObject = {"produk": { "buah":[ {"nama": "pisang", "harga": 1000 }, {"nama": "apel", "harga": 7000 }], "ATK":[ {"nama": "pulpen", "harga": 500 }, {"nama":"penggaris", "harga": 100 }] }}; document.writeln(myObject.produk.buah[1].nama); // outputnya adalah apel document.writeln(myObject.produk.buah[1].harga); // outputnya adalah 7000 </script> </body> </html> Contoh di atas mendeklarasikan data dengan JSON. Tampak seperti sebuah struktur data yang cukup mudah untuk dimengerti, bukan? Untuk mengakses dan menampilkannya, Anda dapat menggunakan perintah JavaScript document.writeln seperti yang tertulis juga pada kode program di atas. Melihat cara penulisan JSON, Anda tentu akan memaklumi mengapa JSON merupakan singkatan dari JavaScript Object Notation, karena JSON memang berbasiskan JavaScript. Tipe data dalam JSON dapat dikategorikan sebagai beri-kut: 1. Number (berupa integer, real, atau floating point). 2. String. 3. Boolean (true dan false). 4. Array. 5. Object. 6. null. Kombinasi JSON dan AJAX JSON sering digunakan didalam aplikasi AJAX sebagai alternatif lain penggunaan XML. Pembahasan mengenai AJAX telah pernah dibahas dalam edisi terdahulu PC Media, tetapi sekadar mengingatkan kembali, secara garis besar AJAX merupakan teknik untuk menciptakan aplikasi web yang interaktif, tidak kalah dengan aplikasi desktop. Hal ini membuat garis perbedaan antara aplikasi web dan aplikasi desktop semakin tipis. Web interaktif, tentunya melibatkan pertukaran data antara server dan browser, format data yang dipergunakan sebaiknya bersifat universal, ringan, dan mudah diimplementasikan. Karena itulah XML sering digunakan dalam aplikasi AJAX. Tetapi sekarang, AJAX memiliki JSON sebagai alternatif pasangan baru. Walaupun XML seolah sudah mengikat AJAX melalui singkatan AJAX itu sendiri: Asynchronous JavaScript and XML, tapi apalah arti sebuah nama? Hal ini sah-sah saja, anggaplah AJAX juga tidak mau kalah dengan selebriti dalam hal gonta-ganti pasangan. Tapi yang kena getahnya kan programer? Karena harus mempelajari lagi pemrograman baru, cara baru, teknik baru, dan seterusnya? Kalau begitu, salahkan saja programer (yang membuat JSON dan teknologi lainnya), karena menciptakan semua hal baru tersebut. Sedikit pesan moral jika sebagai programer kita mengeluh karena mempelajari hal yang baru: pekerjaan programer dituntut untuk menciptakan hal yang baru, contohnya dari membuat aplikasi sederhana, membuat sistem manual menjadi otomatis, atau bahkan membuat saingan JSON (mungkin saja, bukan?), di mana karya tersebut baru berarti jika ada yang menggunakan atau mempelajarinya, lalu apa alasan kita untuk mengeluh karena ada hal baru yang harus dipelajari? Walaupun demikian, selektif tetap menjadi kata kunci untuk mempelajari teknologi. Kembali pada pasangan JSON dan AJAX, berikut akan ditampilkan contoh sederhana kombinasi JSON dan AJAX. Kita akan membuat aplikasi web sederhana yang menampilkan secara acak sebuah lagu yang diambil dari kumpulan lagu dengan format data JSON. Siapkan sebuah file text sebagai data, beri nama file berikut dengan data.txt, yang berisi: {"playing":[ {"title": "Bat Country", "singer": "Avenged Sevenfold" }, {"title": "Amazing", "singer": "Aerosmith" }, {"title": "Pull Me Under", "singer": "Dream Theater" }] } Contoh data di atas menyimpan tiga buah judul lagu beserta nama penyanyi/band yang membawakannya. Berikutnya kita akan membuat sebuah file HTML, beri nama dengan index.html, dan berisi kode sebagai berikut: <html> <head> <title> JSON - Ajax Demo </title> <script type="text/javascript"> var url = "data.txt"; function handleHttpResponse() { if (http.readyState == 4) { if(http.status==200) { var results = eval("(" + http.responseText + ")"); // random dari 0 s/d 2 var rand_no = Math.random(); rand_no = rand_no * 3; rand_no = Math.ceil(rand_no); rand_no = rand_no - 1; document.write(results.playing[rand_no].title); document.write(" - oleh "); document.write(results.playing[rand_no].singer); } } } function requestInput() { http.open("GET", url, true); http.onreadystatechange = handleHttpResponse; http.send(null); } function getHTTPObject() { var xmlhttp; if(window.XMLHttpRequest){ xmlhttp = new XMLHttpRequest(); } else if (window.ActiveXObject){ xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); if (!xmlhttp){ xmlhttp=new ActiveXObject("Msxml2.XMLHTTP"); } } return xmlhttp; } var http = getHTTPObject(); </script> </head> <body> <INPUT type="button" id=button2 onclick="requestInput()" value="Sekarang Sedang Memutar Lagu..." /> </body> </html> Jalankan index.html pada browser Anda melalui HTTP. Tampilan awal akan seperti pada Gambar 1. Jika Anda mengklik tombol "Sekarang Sedang MemutarLagu...", maka akan tampil secara acak sebuah judul lagu beserta penyanyinya seperti pada Gambar 2. Contoh sengaja dibuat mendasar dan sederhana, karena setelah Anda memahami cara kerja program di atas, maka Anda akan dapat melakukan modifikasi lebih lanjut entah dengan menggunakan database, atau menggunakan bahasa pemrograman PHP, ASP/ASP.NET, dan seterusnya. JSON dan RSS Anda sering mendengar RSS (Really Simple Syndication) atau-pun Atom, yang merupakan format web feed, saat ini telah banyak digunakan oleh pengguna Internet untuk dapat tetap mengikuti berita pada website favoritnya. JSON juga dapat digunakan sebagai format web feed, salah satunya dengan menggunakan Google Data APIs (atau biasa disingkat GData). GData sendiri merupakan protokol untuk membaca dan menulis data pada web, yang dilakukan GData adalah melakukan konversi format XML feed menjadi format JSON. Tidak jauh berbeda, Yahoo! Pipes juga melakukan transformasi RSS feed dari format XML ke dalam format JSON, sehingga website Anda dapat langsung mengakses data RSS tanpa memerlukan script pada sisi server. Dengan dukungan dari dua raksasa Internet ini, penggunaan JSON nampak telah dan akan semakin meluas dengan cukup signifikan (siapa yang tidak kenal Google dan Yahoo!), dan mau tidak mau, tentu saja juga mengundang perdebatan pro dan kontra mengenai mana yang lebih baik, JSON ataukah XML. Walaupun untuk saat ini, keberadaan XML dalam RSS jelas masih diperlukan karena format JSON merupakan konversi dari format XML yang telah ada. Tetapi, ibarat ada dua nahkoda dalam satu kapal, selalu tersedia ruang debat yang sulit berakhir. XML vs JSON Pertanyaan menarik adalah, bagaimana jika JSON ditandingkan dengan XML. Walaupun mungkin hasilnya mirip dengan film horor Freddy vs Jason, dua tokoh horor yang saling bertempur. Jika Anda melihat akhir film tersebut, bisa jadi menimbulkan perdebatan mengenai siapa yang lebih unggul. Beberapa hal yang dapat diperbandingkan antara XML vs JSON, antara lain: 1. Format Penulisan. XML memiliki format yang sangat familiar bagi Anda yang telah mengenal HTML. Sementara JSON, seperti yang Anda lihat pada contoh kode di atas, juga memiliki format yangsederhana dan mudah dipahami. Lalu, pertanyaannya adalah lebih mudah yang mana? Ternyata menjawab pertanyaan sederhana ini pun tidak mudah, cukup banyak yang mengatakan JSON lebih mudah, dan juga sebaliknya. Bagi penulis pribadi, masing-masing ada keuntungan dan kerugian, penulisan JSON yang menggunakan simbol kurung siku dan kurung kurawal, juga tanda kutip, dapat mempersulit pembacaan manual, sehingga kesalahan ketik lebih sulit terdeteksi. Tetapi, untuk merepresentasikan sebuah struktur data yang rumit dan berbentuk hirarkis penulisan JSON relatif lebih terstruktur dan mudah. 2. Ukuran. Jika dibandingkan secara umum, ukuran karakter yang dibutuhkan JSON lebih kecil dibandingkan XML untuk data yang sama. Hal ini tentu berpengaruh pula pada kecepatan pertukaran data, walaupun tidak signifikan untuk data yang kecil, namun cukup berarti jika Anda menggunakan koneksi yang relatif lambat untuk mengakses aplikasi web kaya fitur yang memanfaatkan pertukaran data. Di sini JSON lebih unggul dibandingkan XML, kecuali jika data dikompresi terlebih dahulu sebelum dikirimkan, perbedaan JSON dan XML yang telah dikompresi tidaklah signifikan. 3. Browser Parsing. Proses parsing merupakan proses pengenalan token atau bagian-bagian kecil dalam rangkaian dokumen XML/JSON. Contohnya, Anda memiliki data text dalam format JSON seperti contoh yang telah kita pelajari, data tersebut harus di-parsing terlebih dahulu sebelum dapat diakses dan dima-nipulasi. Browser parsing berarti proses parsing yang terjadi pada sisi client/browser. Melakukan browser parsing pada JSON lebih sederhana dibandingkan pada XML, JSON menggunakan function JavaScript eval() untuk melakukan parsing. Sementara dokumen XML di-parsing oleh XMLHttpRequest. Rata-rata survai menobatkan JSON sebagai pemenang jika diadu kecepatan parsingnya. 4. Konversi Format. Memang cukup ironis, format data seperti XML dan JSON dibuat dengan tujuan agar bahasa/format pertukaran data yang digunakan dapat berlaku universal, tetapi karena banyaknya pilihan jenis format data yang dipergunakan, bisa jadi Anda harus melakukan konversi antarformat data yang "universal" tersebut. Jadi, format data yang benar-benar sampai pada pengertian universal sampai saat ini mungkin belum ada, untungnya semuanya berbasis teks, sehingga dimungkinkan konversi format yang relatif mudah. Jika dibandingkan, format XML lebih mudah untuk dikonversi ke format lain, seperti HTML, SVG, comma-delimited, dan juga JSON. Salah satunya adalah berkat XSLT (Extensible Stylesheet Language Transformations), yang digunakanuntuk transformasi dokumen XML ke format dokumen lainnya, dukungan XSLT yang baik pada sisi browser dan server semakin mempermudah proses secara umum. Pada JSON, prosesnya konversi ke format lain belum se-sederhana itu, karena belum tersedia dukungan built-in sebagaimana XSLT untuk XML. Walaupun hal ini mungkin hanya masalah waktu jika JSON semakin dapat diterima umum. Produk yang baik dan dapat diterima luas tentu akan mendapat banyak dukungan dan menciptakan peluang bisnis yang saling menguntungkan. 5. Keamanan. Seperti telah dikemukakan, fungsi eval() melakukan parsing JSON, menjadi objek JavaScript yang siap digunakan. Hal ini menimbulkan celah keamanan karena memungkinkan masuknya kode-kode berupa function executable yang tidak diinginkan, karena itu pastikan data JSON yang Anda gunakan berasal dari sumber yang terpercaya. Untuk alasan keamanan tersebut, proses parsing JSON sering dilengkapi dengan keamanan tambahan, misalnya dengan menambahkan regular expression. Website json.org menyediakan Library JavaScript yang dapat di-download di http://www.json.org/json2.js, di mana library tersebut merekomendasikan penggunaan function parse-nya sebagai pengganti function eval(). Karena isu keamanan tampak tidak ada habisnya, jangan terpatok pada library versi tertentu, selalu periksa apakah ada update versi terbaru. Untuk XML, karena hanya menyimpan data (seharusnya tidak bisa disusupi function yang bisa dieksekusi), dalam hal ini memiliki tingkat keamanan yang lebih baik. Masa Depan JSON Saat ini, penggunaan JSON disokong penuh oleh Yahoo!, misalnya melalui Yahoo! Pipes yang mengizinkan Anda membuat aplikasi web yang diambil dari berbagai sumber. Dauglas Crockford yang mengenalkan JSON itu sendiri merupakan arsitek senior JavaScript di Yahoo!. Tidak hanya Yahoo!, bahasa pemrograman seperti PHP, Phyton, Delphi, ASP, dan lain-lain juga telah mendukung JSON (daftar lengkapnya dapat dilihat pada website json.org). Selain itu, statistik pada Google Trends (http://www.google. com/trends?q=json) juga menunjukkan peningkatan kontinyu pencarian keyword JSON, sebagai indikasi kepopularan JSON yang semakin dikenal luas. Apakah ini pertanda di masa depan yang mungkin tidak terlalu jauh, JSON akan menggeser XML? Ataukah XML masih mampu bertahan, ataukah akan ada format pertukaran data lain yang akan lebih popular dari keduanya? Atau mungkin juga tidak akan ada satupun yang mendominasi secara signifikan mengingat luasnya kebutuhan pasar. Waktu juga yang akan menjawabnya. LEBIH LANJUT · http://www.json.org/ · http://en.wikipedia.org/wiki/JSON · http://en.wikipedia.org/wiki/Xml [pcmedia]

1 komentar:

Almas said...

Isi konten yang mudah di pahami, sangat membantu

Post a Comment

saran, komentar dan kritikan anda sangat berharga buat saya, terima kasih.