在前端開發(fā)中，需要向其他域名的服務(wù)器發(fā)起網(wǎng)絡(luò)請(qǐng)求是經(jīng)常遇到的事情。但由于瀏覽器同源策略的限制，使得跨域請(qǐng)求變得復(fù)雜和困難。

那么怎樣實(shí)現(xiàn)跨域請(qǐng)求呢？這就需要我們學(xué)習(xí)一下 jQuery 中的 JSONP。

$.ajax({
url: 'http://www.example.com/api/user',
dataType: 'jsonp',
type: 'get',
jsonp: 'callback',
success: function(data){
console.log(data);
},
error: function(xhr, status, error){
console.log('請(qǐng)求失敗');
}
});

如上代碼片段，我們可以看到在使用 jQuery 的 ajax 方法時(shí)，只需要設(shè)置 dataType 為 jsonp，同時(shí)設(shè)置一個(gè) jsonp 的回調(diào)參數(shù)名，服務(wù)器就會(huì)以 JSONP 格式返回?cái)?shù)據(jù)。JSONP 的原理是在頁(yè)面中動(dòng)態(tài)創(chuàng)建一個(gè) script 標(biāo)簽，src 屬性指向服務(wù)器 API，同時(shí)再指定一個(gè)回調(diào)函數(shù)名，服務(wù)器端將數(shù)據(jù)以 JavaScript 對(duì)象的形式傳遞到回調(diào)函數(shù)中返回。由于 script 標(biāo)簽的 src 屬性可以跨域訪問，因此我們可以通過 JSONP 來跨域請(qǐng)求數(shù)據(jù)。

綜上，當(dāng)有跨域請(qǐng)求時(shí)，我們可以使用 jQuery 的 JSONP 功能進(jìn)行處理。通過動(dòng)態(tài)創(chuàng)建 script 標(biāo)簽來實(shí)現(xiàn)跨域請(qǐng)求，從而達(dá)到獲取數(shù)據(jù)的目的。