Rumah > Artikel > hujung hadapan web > Fahami sepintas lalu: Penjelasan terperinci tentang jsonp_jquery
Saya percaya bahawa semua orang banyak menggunakan json. Saya tidak pernah mempunyai peluang untuk menggunakan jsonp, tetapi saya sering melihatnya. Saya hanya tahu bahawa ia "digunakan untuk merentas domain" dan saya tidak tahu apa itu. Saya akhirnya memikirkannya hari ini. Mari kita langkah demi langkah untuk mengetahui apa itu jsonp.
Dasar Asal Yang Sama
Pertama sekali, atas sebab keselamatan, penyemak imbas mempunyai mekanisme yang dipanggil dasar asal yang sama menghalang dokumen atau skrip yang dimuatkan daripada satu sumber daripada mendapatkan atau menetapkan atribut dokumen yang dimuatkan daripada sumber lain. Nampaknya saya tidak tahu apa maksudnya, tetapi anda akan mengetahuinya selepas anda mengamalkannya.
1. Cipta dua halaman web sesuka hati
Satu port ialah 2698 dan satu lagi ialah 2701. Secara definisi, ia adalah daripada sumber yang berbeza.
2. Gunakan jQuery untuk memulakan permintaan daripada sumber yang berbeza
Tambahkan butang pada halaman web pada port 2698 dan acara Klik akan memulakan dua permintaan ke domain dengan port 2701.
$.get("http://localhost:2701/home/index", fungsi (data) {
console.log(data)
})
})
OK, ternyata jsonp adalah untuk menyelesaikan masalah ini.
Keupayaan merentas domain bagi teg skrip
Saya tidak tahu sama ada anda tahu tentang CDN, seperti CDN Microsoft Menggunakannya, halaman web kami tidak perlu menyediakan jQuery, dan tapak web Microsoft akan menyediakannya untuk kami:
Halaman web yang sama dengan port 2698 memulakan permintaan untuk domain 2701 Menetapkan atribut scr dalam skrip adalah OK, tetapi cara lain adalah tragis. Mengambil kesempatan daripada keupayaan skrip merentas domain, ini adalah asas jsonp.
Gunakan skrip untuk mendapatkan json daripada sumber yang berbeza
Oleh kerana ia dipanggil jsonp, jelas bahawa tujuannya masih json, dan ia diperoleh merentasi domain. Berdasarkan analisis di atas, mudah untuk difikirkan: gunakan js untuk membina teg skrip, tetapkan url json kepada atribut scr skrip, masukkan skrip ke dalam dom, dan biarkan penyemak imbas mendapatkannya. Amalan: