Permintaan Silang Asal dengan JSONP: Contoh jQuery dan PHP yang Mudah
Dalam contoh ini, kami akan menangani cabaran silang- permintaan asal menggunakan JSONP, teknik elegan yang membolehkan komunikasi antara JavaScript dan pelayan web daripada berbeza domain.
Mari bayangkan anda mahu menghantar permintaan silang asal daripada klien jQuery ke pelayan PHP dan mendapatkan semula respons tersuai. Untuk mencapai matlamat ini, kami akan menggunakan kaedah $.getJSON jQuery untuk memulakan permintaan JSONP.
Skrip jQuery:
$.getJSON('http://example.com/jsonp.php?callback=?', 'firstname=Jeff', function(response) { alert('Your name is ' + response.fullname); });
Pelayan PHP Skrip:
<?php $firstname = $_GET['firstname']; if ($firstname == 'Jeff') { header('Content-Type: application/json'); echo $_GET['callback'] . '(' . json_encode(['fullname' => 'Jeff Hansen']) . ')'; } ?>
Penjelasan:
Apabila anda memanggil $.getJSON dengan URL yang mengandungi '?callback=?', jQuery mengendalikan JSONP secara automatik permintaan. Skrip PHP sebelah pelayan bertindak balas dengan objek JSON yang dibalut dalam panggilan fungsi yang sepadan dengan panggilan balik yang disediakan oleh jQuery. Dalam kes ini, panggilan balik diluluskan sebagai parameter pertama dalam permintaan GET.
Mengendalikan Respons HTML:
Jika anda ingin mengembalikan HTML dalam respons , anda boleh menggunakan fungsi dan bukannya objek JSON dalam skrip PHP:
<?php $firstname = $_GET['firstname']; if ($firstname == 'Jeff') { header('Content-Type: text/html'); echo '<h1>Welcome, Jeff Hansen!</h1>'; } ?>
Dan di sebelah jQuery, anda boleh mengendalikan respons sebagai seperti:
$.getJSON('http://example.com/jsonp.php?callback=?', 'firstname=Jeff', function(response) { $('#container').html(response); });
Atas ialah kandungan terperinci Bagaimanakah JSONP dengan jQuery dan PHP Menyelesaikan Isu Permintaan Silang Asal?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!