jquery merentas domain mendapatkan data permintaan

Dalam pembangunan web, kami biasanya perlu meminta data daripada nama domain lain untuk melengkapkan beberapa keperluan perniagaan tertentu Dalam kes ini, permintaan merentas domain diperlukan. Dalam proses ini, permintaan dapatkan rangka kerja jQuery adalah kaedah yang sangat biasa. Artikel ini akan memperkenalkan cara menggunakan kaedah get jQuery untuk membuat permintaan merentas domain dan mendapatkan data.

1. Apakah permintaan merentas domain

Dalam penyemak imbas yang sama, jika nama domain, port atau protokol sumber yang diminta berbeza daripada dokumen semasa, ia dipanggil silang -permintaan domain. Ini disebabkan oleh sekatan dasar asal yang sama penyemak imbas, iaitu, hanya apabila protokol, nama hos dan nombor port kedua-dua URL adalah sama, data dari asal yang sama boleh dihantar. Apabila membuat permintaan merentas domain, penyemak imbas secara automatik akan mencetuskan mekanisme keselamatan untuk menyekat permintaan daripada nama domain semasa kepada nama domain lain.

2. Kaedah dapatkan jQuery

jQuery ialah pustaka JavaScript silang pelayar berdasarkan JavaScript. Ia digunakan secara meluas untuk membangunkan halaman dinamik, aplikasi JavaScript kendiri dan permintaan tak segerak. Dalam jQuery, kaedah get tergolong dalam modul ajax dan digunakan untuk mendapatkan data daripada pelayan melalui permintaan HTTP GET.

Apabila melaksanakan permintaan merentas domain, kita perlu menggunakan kaedah get dalam jQuery untuk menghantar permintaan dan menerima data respons. Kaedah ini perlu melepasi tiga parameter berikut:

1. url: alamat URL sumber yang diminta; kejayaan: permintaan berjaya Fungsi panggil balik selepas
2. Antaranya, fungsi panggil balik kejayaan diperlukan dan digunakan untuk memproses data yang dikembalikan selepas permintaan berjaya.
3. 3. Contoh permintaan merentas domain

Sekarang kami menganggap bahawa terdapat antara muka API yang menyediakan set data dalam format JSON dan kami perlu meminta set data ini daripada domain lain nama. Berikut ialah format data JSON yang mudah:

{
    "name": "Apple",
    "color": "Red, Yellow, Green",
    "shape": "Round"
}

Mari dapatkan data dalam format JSON ini melalui kaedah get jQuery:

$.get("https://api.example.com/fruits/apple", function(data) {
    console.log(data);
});

Di sini kami menggunakan URL yang diminta sebagai parameter pertama yang Diluluskan ke get kaedah. Melalui kaedah ini, kami akan menghantar permintaan Dapatkan kepada antara muka API dan mendapatkan data JSON yang dikembalikan oleh antara muka selepas permintaan itu berjaya. Data JSON ini dihantar ke parameter data dalam fungsi panggil balik dan kami boleh memproses data dalam fungsi ini.

Walau bagaimanapun, dalam penggunaan sebenar, permintaan mungkin gagal dengan mesej ralat. Dalam kes ini, kita boleh menggunakan kaedah fail jQuery untuk mendapatkan mesej ralat.

$.get("https://api.example.com/fruits/apple", function(data) {
    console.log(data);
}).fail(function() {
    console.log("请求失败");
});

Dalam contoh ini, kami menggunakan kaedah fail untuk mendapatkan maklumat ralat permintaan. Jika permintaan gagal, konsol akan mencetak mesej ralat "Permintaan gagal". Dengan cara ini kita boleh mengendalikan mesej ralat dengan sewajarnya.

4. Prasyarat untuk permintaan merentas domain

Dalam permintaan merentas domain, pelayan perlu membuat beberapa tetapan untuk membenarkan permintaan daripada nama domain lain, jika tidak, penyemak imbas akan menyekat permintaan dan paparan mesej ralat. Untuk menyelesaikan masalah ini, kami boleh menambah maklumat pengepala CORS (Cross-Origin Resource Sharing) pada bahagian pelayan untuk membenarkan permintaan daripada nama domain lain.

Dalam antara muka API, kami boleh menambah "Access-Control-Allow-Origin" dalam pengepala respons HTTP untuk menentukan asal permintaan yang dibenarkan. Sebagai contoh, dalam PHP, kita boleh menambah kod berikut:

header("Access-Control-Allow-Origin: *");

Dalam contoh ini, simbol asterisk bermakna permintaan daripada mana-mana nama domain dibenarkan. Jika anda hanya membenarkan nama domain tertentu untuk meminta data, anda boleh menggantikan asterisk dengan nama domain sasaran. Sebagai contoh, jika anda hanya membenarkan example.com untuk meminta data, anda boleh menetapkannya seperti ini:

header("Access-Control-Allow-Origin: https://example.com");

Sudah tentu, jika anda menggunakan Node.js, anda boleh menggunakan rangka kerja seperti Express dan Koa untuk menetapkan maklumat pengepala CORS. Berikut ialah kod contoh Express yang ringkas:

const express = require('express');
const app = express();

// 添加CORS头信息
app.use((req, res, next) => {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    next();
});

// 返回JSON数据
app.get('/fruits/apple', (req, res) => {
    res.json({"name": "Apple", "color": "Red, Yellow, Green", "shape": "Round"});
});

// 监听端口
app.listen(3000, () => console.log('Example app listening on port 3000!'));

Dalam contoh ini, kami menggunakan rangka kerja Express untuk mencipta perkhidmatan HTTP dan menambah maklumat pengepala CORS pada perisian tengah. Dalam permintaan dapatkan, kami mengembalikan set data dalam format JSON kepada klien. Jika semuanya berfungsi dengan baik, pelanggan sepatutnya berjaya mendapatkan data.

5. Ringkasan

Melalui pengenalan artikel ini, kami telah mempelajari apa itu permintaan merentas domain, cara menggunakan kaedah get jQuery untuk membuat permintaan merentas domain, dan memperkenalkan beberapa tetapan yang diperlukan pada pelayan. Permintaan merentas domain ialah masalah biasa dalam pembangunan web Dengan menggunakan rangka kerja jQuery, kami boleh menyelesaikan masalah ini dengan mudah dan mendapatkan data dengan cara yang sangat cekap.

Atas ialah kandungan terperinci jquery merentas domain mendapatkan data permintaan. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!