Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk Membuat Permintaan JSONP Cross-Domain dalam JavaScript Tanpa jQuery?

Bagaimana untuk Membuat Permintaan JSONP Cross-Domain dalam JavaScript Tanpa jQuery?

Susan Sarandon
Susan Sarandonasal
2024-10-29 19:37:30181semak imbas

How to Make Cross-Domain JSONP Requests in JavaScript Without jQuery?

Membuat Permintaan JSONP Merentas Domain dalam JavaScript Tanpa Pustaka Luaran

JSONP (JSON dengan Padding) ialah teknik yang membenarkan permintaan merentas domain dengan menambahkan fungsi panggil balik pada URL permintaan. Fungsi panggil balik ditakrifkan oleh pelanggan dan dilaksanakan oleh pelayan apabila permintaan berjaya diterima.

Cara Membuat Permintaan JSONP Tanpa jQuery

Untuk membuat Permintaan JSONP tanpa jQuery, anda boleh mengikuti langkah berikut:

  1. Buat fungsi panggil balik: Tentukan fungsi yang akan dipanggil apabila pelayan bertindak balas dengan data JSON. Fungsi ini akan disediakan dengan data sebagai hujah.
<code class="javascript">function foo(data) {
    // Process the JSON data
}</code>
  1. Bina URL JSONP: Cipta URL untuk permintaan JSONP dengan menambahkan fungsi panggil balik nama sebagai parameter pertanyaan.
<code class="javascript">const url = '//example.com/path/to/jsonp?callback=foo';</code>
  1. Buat elemen skrip: Cipta elemen skrip dan tetapkan atribut srcnya kepada URL JSONP.
<code class="javascript">const script = document.createElement('script');
script.src = url;</code>
  1. Tambahkan elemen skrip pada DOM: Tambahkan elemen skrip pada kepala dokumen. Ini akan mencetuskan permintaan kepada pelayan.
<code class="javascript">document.head.appendChild(script);
// or document.getElementsByTagName('head')[0].appendChild(script) in older browsers</code>

Setelah pelayan bertindak balas dengan data JSON, fungsi panggil balik akan dilaksanakan dan anda boleh menggunakan data yang disediakan untuk mengisi aplikasi anda.

Atas ialah kandungan terperinci Bagaimana untuk Membuat Permintaan JSONP Cross-Domain dalam JavaScript Tanpa jQuery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn