Rumah > Artikel > hujung hadapan web > data permintaan http merentas domain jquery
jquery ialah perpustakaan JavaScript popular yang digunakan untuk memudahkan operasi DOM, pemprosesan acara, kesan animasi, dsb. Aplikasi yang paling biasa adalah untuk meminta data hujung belakang melalui Ajax untuk mencapai pengalaman tanpa muat semula halaman. Walau bagaimanapun, dalam beberapa kes, kami perlu mendapatkan data daripada berbilang nama domain yang berbeza, dan dalam kes ini, permintaan merentas domain diperlukan. Artikel ini akan memperkenalkan cara menggunakan jquery untuk melaksanakan data permintaan http merentas domain.
1. Apakah permintaan merentas domain?
Di sisi penyemak imbas, disebabkan oleh sekatan dasar asal yang sama penyemak imbas, ia tidak dibenarkan untuk mengakses data di bawah nama domain lain daripada halaman dalam satu nama domain, iaitu Polisi Asal Sama. Homologi bermaksud bahawa protokol, nama domain dan nombor port mestilah betul-betul sama. Contohnya, https://www.example.com dan https://example.com mempunyai asal-usul yang berbeza dan http://www.example.com dan http://www.example.org mempunyai asal-usul yang berbeza.
Permintaan Silang Asal merujuk kepada proses meminta data daripada satu sumber (nama domain, protokol, nombor port) kepada sumber lain. Untuk melaksanakan permintaan merentas domain, penyemak imbas perlu melengkapkan satu siri pengesahan keselamatan untuk memastikan data yang diminta dibenarkan.
2. Kaedah permintaan merentas domain
Pada masa ini, kaedah permintaan merentas domain yang lebih popular adalah seperti berikut:
JSONP ialah kaedah untuk mencapai komunikasi merentas domain antara domain yang berbeza dengan menambahkan teg 855348821b2e8f2cc4b633bf98f064df dan menggunakan penyemak imbas untuk membenarkan akses merentas domain kepada fail JS. JSONP boleh menggunakan atribut src teg 855348821b2e8f2cc4b633bf98f064df untuk membuat permintaan HTTP kepada nama domain lain dan data yang dikembalikan akan menyertakan kod untuk melaksanakan fungsi panggil balik, dengan itu merealisasikan permintaan data merentas domain dan mekanisme panggil balik.
CORS ialah teknologi perkongsian sumber rentas asal standard yang membolehkan pelayan bertindak balas kepada permintaan halaman web daripada sumber lain melalui pengepala HTTP baharu. CORS memerlukan sokongan pelayar dan pelayan Selagi pelayan mengenal pasti bahawa respons boleh diakses oleh domain lain, penyemak imbas akan membenarkan permintaan merentas domain ini.
Kaedah proksi merujuk kepada menggunakan pelayan proksi di bawah nama domain yang sama, kemudian membenarkan pelayan proksi meminta data daripada nama domain lain, dan akhirnya mengembalikan minta keputusan Penyelesaian untuk bahagian hadapan. Premis bahawa kaedah ini boleh dilaksanakan ialah tiada sekatan merentas domain pada antara muka yang diakses. Ia sesuai untuk situasi di mana protokol JSONP tidak disokong dan CORS tidak dapat memenuhi keperluan merentas domain.
PostMessage ialah API untuk komunikasi merentas dokumen antara tingkap Ia menyediakan cara komunikasi silang sumber, membenarkan satu dokumen menghantar mesej ke dokumen lain . Hantar mesej tanpa mengira sama ada kedua-dua dokumen mempunyai asal yang sama.
WebSocket ialah protokol baharu dalam HTML5 Ia adalah protokol komunikasi dua hala berdasarkan protokol TCP dan boleh mencapai komunikasi merentas domain daripada protokol HTTP WebSocket akan membuat sambungan TCP untuk penghantaran data, dan peningkatan protokol diperlukan semasa membuat sambungan.
Kaedah di atas masing-masing mempunyai kelebihan dan keburukan tersendiri. Pilih kaedah permintaan merentas domain yang sesuai mengikut senario tertentu.
3. Gunakan jquery untuk permintaan merentas domain
Menggunakan jquery untuk permintaan merentas domain terutamanya memerlukan penggunaan kaedah ajax dalam jquery Kaedah ini juga menyokong permintaan tak segerak sebagai Sokongan untuk dua kaedah permintaan biasa, GET dan POST. Penggunaan khusus adalah seperti berikut:
Permintaan data Jsonp perlu menentukan bahawa format data yang dikembalikan oleh pelayan adalah format jsonp dan mengandungi parameter bernama panggil balik dengan nilai Nama fungsi panggil balik, dan nama fungsi panggil balik dilaksanakan melalui parameter panggil balik parameter src tag skrip jsonp.
$.ajax({
url: 'http://example.com/jsonp', type: 'GET', dataType: 'jsonp', //指定数据类型为jsonp jsonp: 'callback', //指定回调函数名称 success: function(res) { console.log(res); }
});
Permintaan Cors dibuat dengan menambahkan Access dalam tajuk -Control-Allow-Origin medan dilaksanakan. Dalam jquery, apabila menghantar permintaan merentas domain melalui kaedah ajax, anda boleh melaksanakan permintaan merentas domain dengan menetapkan parameter xhrFields. Antaranya, parameter withCredentials digunakan untuk mengawal sama ada penyemak imbas membawa maklumat kuki.
$.ajax({
url: 'http://example.com/cors', type: 'GET', xhrFields: { withCredentials: true //允许携带cookie信息 }, success: function(res) { console.log(res); }
});
4. Ringkasan
Permintaan merentas domain ialah keperluan yang sangat biasa dalam pembangunan bahagian hadapan. . Artikel ini Artikel ini memperkenalkan kaedah permintaan merentas domain biasa dan cara menggunakan jquery untuk melaksanakan data permintaan http merentas domain. Kaedah permintaan merentas domain yang berbeza mempunyai kelebihan dan keburukan tersendiri. Pilih kaedah yang sesuai mengikut keperluan tertentu. Apabila melaksanakan permintaan merentas domain, anda perlu memberi perhatian kepada isu keselamatan untuk mengelakkan serangan berniat jahat.
Atas ialah kandungan terperinci data permintaan http merentas domain jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!