Menerima data dari pos oleh json handler. Kirim data JSON dari Javascript ke PHP

Menggunakan JSON di sisi server untuk menerima permintaan dan membuat tanggapan

Seri Konten: Nilai Sebenarnya JSON

Kami telah berbicara tentang betapa nyamannya JSON sebagai format data untuk aplikasi Ajax karena memungkinkan Anda dengan cepat mengonversi objek JavaScript menjadi nilai string dan sebaliknya. Karena aplikasi Ajax paling cocok untuk mengirim dan menerima teks biasa, hampir selalu lebih baik menggunakan API yang dapat menghasilkannya; JSON, selain fitur ini, juga memungkinkan Anda bekerja dengan objek JavaScript asli dan tidak khawatir tentang tampilan objek tersebut di teks.

Pusat sumber daya Ajax di developerWorks
Lihat sumber lengkap untuk pemrograman Ajax, dengan artikel, tutorial, forum, blog, wiki, acara, dan berita. Jika terjadi sesuatu, ada informasinya.

XML memiliki keunggulan format teks yang sama dengan JSON, tetapi API untuk mengonversi objek JavaScript ke XML (dan ada beberapa) tidak berkembang dengan baik dibandingkan dengan XML. antarmuka perangkat lunak json; Saat membuat dan memodifikasi objek, terkadang Anda harus memastikan bahwa API yang dipilih dapat bekerja secara normal dengan objek tersebut. Dengan JSON lebih mudah: ia menangani hampir semua jenis objek yang bisa dibayangkan dan mengembalikan data kepada Anda dalam representasi JSON yang bagus.

Jadi, nilai paling penting dari JSON adalah memungkinkan Anda bekerja dengan JavaScript JavaScript, dan tidak seperti bahasa pemformatan data. Jadi Anda dapat menerapkan semua keterampilan yang diperoleh dalam bekerja dengan objek JavaScript dalam kode Anda, tanpa khawatir tentang bagaimana objek tersebut akan diubah menjadi teks. Anda cukup memanggil metode JSON sederhana di akhir:

String myObjectInJSON = myObject.toJSONString();

dan menerima teks yang dapat dikirim ke server.

Mengirimkan JSON ke server

Dalam pengiriman data JSON tidak ada yang rumit pada server, tapi ini poin penting, dan Anda memiliki sejumlah opsi untuk dipilih. Namun, jika Anda memilih JSON, maka akan lebih mudah untuk membuat keputusan lebih lanjut, karena pilihannya akan dipersempit secara signifikan, dan Anda tidak perlu terlalu khawatir. Pada akhirnya, Anda hanya perlu mengirimkan string JSON ke server, sebaiknya secepat dan semudah mungkin.

Mengirim JSON dalam pasangan nama/nilai menggunakan metode GET

Cara paling sederhana untuk mengirimkan data JSON ke server adalah dengan mengonversinya menjadi teks dan mengirimkannya sebagai nilai pasangan nama/nilai. Ingat, data berformat JSON hanyalah salah satu data cantik objek besar, yang terlihat seperti yang ditunjukkan pada Listing 1:

Listing 1. Objek JavaScript sederhana dalam format JSON var people = ( "programmers": [ ( "firstName": "Brett", "lastName":"McLaughlin", "email": " [dilindungi email]" ), ( "Nama Depan": "Jason", "Nama Belakang": "Pemburu", "email": " [dilindungi email]" ), ( "Nama Depan": "Elliotte", "Nama Belakang": "Harold", "email": " [dilindungi email]" ) ], "penulis": [ ( "firstName": "Isaac", "lastName": "Asimov", "genre": "fiksi ilmiah" ), ( "firstName": "Tad", "lastName": " Williams", "genre": "fantasi" ), ( "firstName": "Frank", "lastName": "Peretti", "genre": "christian fiksi") ], "musisi": [ ( "firstName": "Eric", "lastName": "Clapton", "instrumen": "gitar" ), ( "firstName": "Sergei", "lastName": "Rachmaninoff", "instrumen": "piano" ) ] )

Jadi teks ini dapat dikirim ke skrip server di dalam pasangan nama/nilai, seperti ini:

var url = "organizePeople.php?people=" + people.toJSONString(); xmlHttp.open("GET", url, benar); xmlHttp.onreadystatechange = halaman pembaruan; xmlHttp.kirim(null);

Semuanya tampak baik-baik saja di sini, namun kenyataannya ada satu kendala: string data JSON kami berisi spasi dan karakter lain yang dapat coba ditafsirkan oleh browser Web. Untuk mencegah karakter ini menyebabkan masalah pada server (dan mengganggu transfer data), Anda harus menambahkan fungsi JavaScript escape() ke dalam kode. Seperti ini:

var url = "organizePeople.php?people=" + escape(people.toJSONString()); request.open("GET", url, benar); request.onreadystatechange = updatePage; permintaan.kirim(null);

Fungsi ini menangani spasi, garis miring, dan hal lain yang dapat membingungkan browser. Ini mengubahnya menjadi karakter "aman" dalam pengertian ini (misalnya, spasi diubah menjadi urutan escape %20, yang tidak lagi dianggap oleh browser sebagai spasi, tetapi hanya dikirimkan ke server tanpa perubahan). Kemudian server akan melakukan konversi terbalik (biasanya secara otomatis), dan kami akan menerima string dalam bentuk sebelum transmisi.

Pendekatan ini memiliki dua kelemahan:

  • Pertama, kami mengirimkan data, yang berpotensi berukuran sangat besar, menggunakan permintaan GET yang memiliki batasan panjang string URL. Ukuran maksimum string yang diperbolehkan sangatlah besar, namun kita tidak pernah mengetahui berapa panjang string tersebut setelah mengubah suatu objek menjadi teks, apalagi jika objek tersebut cukup kompleks.
  • Kedua, kami mengirim data melalui jaringan dalam bentuk teks biasa, yang merupakan metode transmisi data paling tidak aman yang bisa dibayangkan.

Untuk lebih jelasnya, kedua kekurangan ini lebih berkaitan dengan keterbatasan permintaan GET dibandingkan dengan spesifikasi JSON. Namun, jika Anda mengirimkan ke server lebih dari sekedar nama belakang atau nama depan pengguna, atau hasil pilihannya dalam formulir di situs Anda, maka kekurangan ini benar-benar dapat menghancurkan hidup Anda. Jika Anda mulai bekerja dengan data yang mungkin setidaknya bersifat rahasia atau ukuran besar, Anda harus memperhatikan permintaan POST.

Mentransfer data JSON menggunakan metode POST

Jika Anda memutuskan untuk menggunakan metode POST daripada GET untuk mengirim data JSON ke server, maka perubahan besar Anda tidak perlu menambahkannya ke kode. Inilah semua yang perlu Anda lakukan:

var url = "organizePeople.php?timeStamp=" + Tanggal baru().getTime(); request.open("POST", url, benar); request.onreadystatechange = updatePage; request.setRequestHeader("Tipe Konten", "application/x-www-form-urlencoded"); permintaan.kirim(orang.toJSONString());

Sebagian besar kode ini seharusnya sudah familiar dari artikel ":" yang membahas pembuatan permintaan POST. Di sini kita membuka permintaan menggunakan POST alih-alih GET, dan menyetel header "Jenis Konten" yang sesuai untuk menunjukkan jenis data yang diharapkan dalam hal ini tampilannya akan seperti ini: application/x-www-form-urlencoded , memperjelas ke server bahwa kita hanya meneruskan data teks, yang pada prinsipnya dapat diterima dari formulir HTML biasa.

Satu lagi uang receh dalam kodenya adalah menambahkan waktu saat ini ke URL. Hal ini dilakukan untuk mencegah permintaan di-cache dan untuk memastikan permintaan dibuat dan dikirim setiap kali metode dipanggil; String URL akan sedikit berbeda setiap kali karena perubahan stempel waktu. Ini adalah teknik yang umum digunakan untuk memastikan bahwa permintaan POST benar-benar dibuat ulang setiap saat dan browser Web tidak mencoba menyimpan tanggapan dari server dalam cache.

JSON hanyalah teks

Pada menggunakan DAPATKAN dan permintaan POST, sangat penting bahwa JSON adalah teks biasa. Itu dapat dengan mudah dimanipulasi dan dikirim ke server karena tidak memerlukan pengkodean khusus. Data teks dapat diproses oleh skrip server apa pun. Jika JSON adalah format biner atau teks yang dikodekan dengan cerdik, segalanya tidak akan sesederhana itu. Jadi, JSON adalah data teks biasa yang pada prinsipnya dapat diterima oleh skrip saat mengirimkan formulir HTML (seperti yang kita lihat pada header "Jenis Konten" di permintaan POST), jadi Anda tidak perlu terlalu khawatir tentang pengirimannya. itu ke server.

Menafsirkan JSON di server

Setelah Anda menulis kode JavaScript sisi klien yang memungkinkan pengguna berinteraksi dengan halaman Web dan formulir Anda, dan memiliki informasi untuk dikirimkan untuk diproses program server, pemain utama dalam aplikasi Anda (dan mungkin di semua yang kami sebut "aplikasi Ajax", dengan asumsi bahwa panggilan ke skrip server dilakukan secara asinkron) adalah server. Dan di sini, pilihan yang Anda buat di sisi klien, memutuskan untuk menggunakan objek JavaScript dan data JSON, harus sesuai dengan keputusan terkait di sisi server, di mana API untuk mendekode data JSON dipilih.

Dua tahap menyuntikkan JSON ke server

Bekerja dengan JSON di sisi server, apa pun bahasa server yang digunakan, pada dasarnya terdiri dari dua tahap:

  • Menemukan API parser/toolkit/helper JSON untuk bahasa sisi server Anda
  • Menggunakan API parser/toolkit/helper JSON untuk mengekstrak data dari permintaan klien dan mengubahnya menjadi bentuk yang dapat dipahami oleh skrip server
  • Dan hanya itu saja. Mari kita lihat lebih dekat kedua tahap tersebut.

    Cari pengurai JSON

    Sumber daya terbaik untuk menemukan parser JSON dan perangkat lunak terkait JSON lainnya adalah situs Web JSON (lihat tautan di ). Selain informasi pendidikan tentang format itu sendiri, di halaman ini Anda dapat menemukan link ke alat JSON dan parser JSON untuk platform apa pun: dari ASP hingga Erlang, dari Pike hingga Ruby. Temukan saja bahasa yang digunakan untuk menulis skrip Anda dan unduh perangkat yang sesuai. Salin sendiri atau perbarui versi bahasa server Anda atau instal saja (ada banyak pilihan: semua tergantung apa yang Anda gunakan di server: C#, PHP, Lisp atau yang lainnya), yang utama adalah skrip atau program Anda mungkin telah menggunakan perangkat ini di server Anda.

    Misalnya, jika Anda menggunakan PHP, Anda cukup memperbaruinya ke versi terbaru 5.2, yang menyertakan ekstensi JSON secara default. Ini mungkin cara termudah untuk memulai JSON jika Anda menggunakan PHP. Jika Anda menggunakan servlet Java, cara termudah adalah dengan menggunakan paket org.json dari json.org. Untuk melakukan ini, Anda perlu mengunduh arsip json.zip dari situs web JSON, menyalin file dari kode sumber ke dalam direktori kompilasi proyek Anda dan kompilasi sesuai kebutuhan - dan Anda akan dapat bekerja dengan JSON. Kira-kira hal yang sama perlu dilakukan ketika menggunakan bahasa lain; penolong terbaik Ini termasuk pengalaman pemrograman Anda sendiri untuk platform server yang sesuai.

    Menggunakan pengurai JSON

    Setelah alat yang diperlukan terinstal, yang tersisa hanyalah menelepon metode yang diinginkan. Sebagai contoh, katakanlah kita menggunakan PHP dan modul JSON-PHP:

    // Ini hanyalah sebuah fragmen dari skrip PHP sisi server yang besar require_once("JSON.php"); $json = Layanan_JSON baru(); // menerima data POST dan memecahkan kodenya $value = $json->decode($GLOBALS["HTTP_RAW_POST_DATA"]); // sekarang kita bekerja dengan variabel $value seperti pada data PHP “mentah” biasa

    Dengan menggunakan kode ini, kami menempatkan semua data (array, beberapa string, nilai tunggal - semua yang ada di struktur data JSON) ke dalam variabel $value, dan dalam format PHP asli.

    Jika kita menggunakan servlet Java dan paket org.json di server, kodenya akan terlihat seperti ini:

    public void doPost(permintaan HttpServletRequest, respons HttpServletResponse) menampilkan ServletException, IOException ( StringBuffer jb = new StringBuffer(); String line = null; coba ( BufferedReader reader = request.getReader(); while ((line = reader.readLine()) != null) jb.append(line); ) catch (Exception e) ( //pesan kesalahan) coba ( JSONObject jsonObject = new JSONObject(jb.toString()); ) catch (ParseException e) ( // crash dan terbakar throw new IOException("Kesalahan mengurai string kueri"); // Kami bekerja dengan data menggunakan metode seperti: // int someInt = jsonObject.getInt("intParamName"); // String someString = jsonObject.getString("stringParamName") ; "); // JSONObject nestedObj = jsonObject.getJSONObject("nestedObjName"); // JSONArray arr = jsonObject.getJSONArray("arrayParamName"); // dan seterusnya... )

    Informasi selengkapnya dapat ditemukan di dokumentasi paket org.json (lihat tautan di bagian ini). (Catatan: jika Anda ingin melihat lebih dekat org.json atau lainnya perangkat lunak untuk bekerja dengan JSON, kirimi saya email dan beri tahu saya. Masukan Anda membantu saya memutuskan apa yang akan saya tulis selanjutnya!).

    Kesimpulan

    Sekarang Anda seharusnya sudah mengetahui sisi teknis penggunaan JSON di server. Namun dalam artikel ini dan artikel saya ingin tidak hanya menunjukkan beberapa aspek teknis, tetapi juga meyakinkan Anda bahwa JSON adalah format data yang sangat fleksibel dan kuat. Bahkan jika Anda tidak menggunakannya di setiap aplikasi, programmer Ajax dan JavaScript yang baik harus selalu memilikinya. alat yang berguna dan dapat menggunakannya ketika diperlukan.

    Saya pasti ingin mendengar tentang Anda pengalaman sendiri bekerja dengan JSON dan bahasa apa yang menurut Anda berfungsi dengan baik—atau mungkin kurang baik—dengan data JSON di sisi server. Kunjungi halaman newsgroup Java dan XML (tautan masuk) dan ceritakan kepada saya. Nikmati JSON dan semua kekuatannya format teks data.

    9 jawaban

    Saya mendapat banyak informasi di sini jadi saya ingin memposting solusi yang saya temukan.

    Masalah: Mengambil data JSON dari Javascript di browser, server dan menggunakan PHP untuk keberhasilan analisisnya.

    Lingkungan: Javascript di browser (Firefox) di Windows. Server LAMPU sebagai server jarak jauh: PHP 5.3.2 di Ubuntu.

    Apa yang berhasil (versi 1):
    1) JSON hanyalah teks. Teks dalam format tertentu, tetapi hanya rangkaian teks.

    2) Dalam Javascript, var str_json = JSON.stringify(myObject) memberi saya string JSON.

    3) Saya menggunakan objek AJAX XMLHttpRequest dalam Javascript untuk mengirim data ke server:
    permintaan= XMLHttpRequest baru()
    permintaan.open("POST", "JSON_Handler.php", benar)
    request.setRequestHeader("Jenis konten", "aplikasi/json")
    permintaan.kirim(str_json)
    [...kode untuk menampilkan respon...]

    4) Di server kode PHP untuk membaca string JSON:
    $str_json = file_get_contents("php://input");
    Ini membaca data POST mentah. $str_json sekarang berisi string JSON yang tepat dari browser.

    Apa yang berhasil (versi 2):
    1) Jika saya ingin menggunakan header permintaan "application/x-www-form-urlencoded", saya perlu membuat string POST standar "x=y&a=b" sehingga ketika PHP menerimanya, dapat ditempatkan di susunan asosiatif$_POST. Jadi, dalam Javascript di browser:

    Var str_json = "json_string=" + (JSON.stringify(objek saya))

    Sekarang PHP akan dapat mengisi array $_POST ketika saya mengirim str_json melalui AJAX/XMLHttpRequest seperti pada versi 1 di atas.

    Menampilkan konten $_POST["json_string"] akan menampilkan string JSON. Menggunakan json_decode() pada elemen array $_POST dengan string json akan mendekode data tersebut dengan benar dan memasukkannya ke dalam array/objek.

    Jebakan yang saya temui:
    Saya awalnya mencoba mengirim string JSON dengan header aplikasi /x -www-form-urlencoded dan kemudian mencoba segera membacanya dari array $_POST di PHP. Array $_POST selalu kosong. Hal ini karena mengharapkan data dalam bentuk yval = xval & . Ia tidak menemukan data seperti itu, hanya string JSON, dan membuangnya begitu saja. Saya melihat header permintaan dan data POST terkirim dengan benar.

    Begitu pula jika saya menggunakan header application/json, saya kembali tidak dapat mengakses data yang dikirim melalui array $_POST. Jika Anda ingin menggunakan header/json konten aplikasi maka Anda harus mengakses file mentah data POSTING dalam PHP melalui input php:// daripada $_POST.

    Literatur:
    1) Bagaimana cara mengakses data POST di PHP: Bagaimana cara mengakses data POST di PHP?
    2) Informasi rinci tentang tipe aplikasi/json dengan beberapa objek sampel yang dapat dikonversi ke string JSON dan dikirim ke server: http://www.ietf.org/rfc/rfc4627.txt< ш >

    berkas Javascript Dengan menggunakan jQuery(lebih bersih, tetapi overhead perpustakaan):

    $.ajax(( ketik: "POST", url: "process.php", data: (json: JSON.stringify(json_data)), tipe data: "json" ));

    File PHP (proses.php):

    Petunjuk arah = json_decode($_POST["json"]); var_dump(arah);

    Harap dicatat bahwa jika Anda menggunakan fungsi panggilan balik dalam javascript Anda:

    $.ajax(( ketik: "POST", url: "process.php", data: (json: JSON.stringify(json_data)), tipe data: "json" )) .done(function(data) ( console.log ("selesai"); konsol.log(data )).gagal(fungsi(data) ( konsol.log("gagal"); konsol.log(data); ));

    Anda harus di dalam diri Anda berkas PHP kembalikan objek JSON (dalam format javascript) untuk mendapatkan hasil "selesai/sukses" di file Anda Kode Javascript. Dengan minimum pengembalian/cetak:

    Mencetak("()");

    Meskipun untuk hal yang lebih serius Anda harus mengirimkannya secara eksplisit judul yang benar dengan kode respons yang sesuai.

    Ada 3 cara relevan untuk mengirim data dari sisi klien (HTML, Javascript, Vbscript..dll) ke sisi server (PHP, ASP, JSP...dll)

    1. bentuk HTML Permintaan Posting (GET atau POST). 2. AJAX (Ini juga berada di bawah GET dan POST) 3. Cookie

    Formulir Permintaan Posting HTML (GET atau POST)

    Ini adalah metode yang paling umum digunakan dan kami dapat mengirim lebih banyak data menggunakan metode ini.

    Ini adalah metode asinkron dan seharusnya berhasil dengan cara yang aman, disini kita juga bisa mengirimkan lebih banyak data.

    Ini cara yang baik menggunakan jumlah kecil data yang tidak sensitif. Ini cara terbaik bekerja dengan sedikit data.

    Dalam kasus Anda, Anda mungkin lebih memilih pengiriman formulir HTML atau AJAX. Namun sebelum mengirim ke server, validasi sendiri json Anda atau gunakan tautan seperti http://jsonlint.com/

    Jika Json Object mengubahnya menjadi String menggunakan JSON.stringify(object), jika Anda memiliki string JSON, kirimkan apa adanya.

    Contoh JavaScript sederhana untuk memasukkan bidang HTML (mengirim JSON ke server, menguraikan JSON dalam PHP dan mengirim kembali ke klien) menggunakan AJAX:

    Nama Belakang
    Usia
    Tampilkan var xmlhttp; fungsi actionSend() ( jika (window.XMLHttpRequest) (// kode untuk

    IE7+, Firefox, Chrome, Opera, Safari xmlhttp = new XMLHttpRequest();

    • ) else (// kode untuk IE6, IE5 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); ) var value = $("input").map(function () ( return $(this).val() ; ) ).mendapatkan();

      var myJsonString = JSON.stringify(nilai);