jquery下利用jsonp跨域訪問(wèn)實(shí)現(xiàn)方法
更新時(shí)間:2010年07月29日 12:42:20 作者:
客戶端的跨域訪問(wèn),可以通過(guò)jsonp方式來(lái)實(shí)現(xiàn),jquery提供了跨域訪問(wèn)的方法,jQuery.ajax()支持get方式的跨域。當(dāng)然支持跨域還需要服務(wù)器端相應(yīng)的處理。
復(fù)制代碼 代碼如下:
$.ajax({
async:false,
url: '', // 跨域URL
type: 'GET',
dataType: 'jsonp',
jsonp: 'jsoncallback', //默認(rèn)callback
data: mydata, //請(qǐng)求數(shù)據(jù)
timeout: 5000,
beforeSend: function(){ //jsonp 方式此方法不被觸發(fā)。原因可能是dataType如果指定為jsonp的話,就已經(jīng)不是ajax事件了
},
success: function (json) { //客戶端jquery預(yù)先定義好的callback函數(shù),成功獲取跨域服務(wù)器上的json數(shù)據(jù)后,會(huì)動(dòng)態(tài)執(zhí)行這個(gè)callback函數(shù)
if(json.actionErrors.length!=0){
alert(json.actionErrors);
}
},
complete: function(XMLHttpRequest, textStatus){
},
error: function(xhr){
//jsonp 方式此方法不被觸發(fā)
//請(qǐng)求出錯(cuò)處理
alert("請(qǐng)求出錯(cuò)(請(qǐng)檢查相關(guān)度網(wǎng)絡(luò)狀況.)");
}
});
復(fù)制代碼 代碼如下:
$.getJSON(url+"?callback=?",
function(json){
});
這種方式其實(shí)是上例$.ajax({..}) 的一種高級(jí)封裝。
在服務(wù)端通過(guò)獲得callback參數(shù)(如:jsonp*****)得到j(luò)Query端隨后要回調(diào)的
然后返回類似:"jsonp*****("+要返回的json數(shù)組+")";
jquery就會(huì)通過(guò)回調(diào)方法動(dòng)態(tài)加載調(diào)用這個(gè):jsonp*****(json數(shù)組);
這樣就達(dá)到了跨域數(shù)據(jù)交換的目的.
JSONP是一種腳本注入(Script Injection)行為,所以也有一定的安全隱患。
注意:jquey是不支持post方式跨域的。
參考:http://www.ibm.com/developerworks/cn/web/wa-aj-jsonp1/
相關(guān)文章
jQuery 移動(dòng)端artEditor富文本編輯器
這篇文章主要介紹了jQuery 移動(dòng)端artEditor富文本編輯器 的相關(guān)資料,需要的朋友可以參考下2016-01-01JQuery對(duì)表單元素的基本操作使用總結(jié)
這篇文章主要介紹了JQuery對(duì)表單元素的基本操作使用總結(jié),需要的朋友可以參考下2014-07-07通過(guò)jquery的ajax請(qǐng)求本地的json文件方法
今天小編就為大家分享一篇通過(guò)jquery的ajax請(qǐng)求本地的json文件方法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-08-08jQuery中隊(duì)列queue()函數(shù)的實(shí)例教程
這篇文章主要介紹了jQuery中隊(duì)列queue()函數(shù)的實(shí)例教程,queue()函數(shù)為JavaScript函數(shù)的執(zhí)行順序控制操作提供了便利,需要的朋友可以參考下2016-05-05jquery實(shí)現(xiàn)選項(xiàng)卡切換代碼實(shí)例
這篇文章主要介紹了jquery實(shí)現(xiàn)選項(xiàng)卡切換,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-05-05jQuery構(gòu)造函數(shù)init參數(shù)分析
這篇文章主要介紹了jQuery構(gòu)造函數(shù)init參數(shù)分析,今天主要是分析一下jQuery中init選擇器構(gòu)造函數(shù),處理選擇器函數(shù)中的參數(shù),感興趣的朋友可以了解下2015-05-05PHP+MySQL+jQuery隨意拖動(dòng)層并即時(shí)保存拖動(dòng)位置實(shí)例講解
這篇文章主要介紹了PHP+MySQL+jQuery隨意拖動(dòng)層并即時(shí)保存拖動(dòng)位置的實(shí)現(xiàn)方法,感興趣的小伙伴們可以參考一下2015-10-10