查看手冊(cè)路幸,我們看到,jquery寫jsonp有兩種方式:
1$.ajax的方式
2$.getJSON的方式
先來看第一種方式:
(1)http://a.com/index.html代碼如下:
其中幾個(gè)參數(shù)需要說明下:
type:代表請(qǐng)求提交的方式
async:是否同步
url:請(qǐng)求地址
dataType:請(qǐng)求的數(shù)據(jù)類型扫夜,是使用jsonp這種跨數(shù)據(jù)訪問協(xié)議的json數(shù)據(jù)格式還是用其他的數(shù)據(jù)格式
jsonp:有了這個(gè)參數(shù),那么實(shí)際請(qǐng)求的url地址會(huì)變成http://b.com/index.php?callback=?,如果jsonp設(shè)置為test111,那么請(qǐng)求地址就是http://b.com/index.php?test111=?
jsonpCallback:定義回調(diào)函數(shù)的名稱,和上面的參數(shù)jsonp一起使用肃拜,如果這個(gè)參數(shù)為myCallback,請(qǐng)求的地址會(huì)變成http://b.com/index.php?callback=myCallback,另外值得注意的是,如果這個(gè)值為空的話雌团,那么jquery會(huì)默認(rèn)隨機(jī)生成一個(gè)函數(shù)名傳過去燃领,那么實(shí)際請(qǐng)求的地址就是:http://b.com/index.php?callback=jquery12253158788754457。
success:請(qǐng)求響應(yīng)成功的回調(diào)
error:請(qǐng)求響應(yīng)失敗的回調(diào)
(2)http://b.com/index.php代碼如下:
(3)請(qǐng)求http://a.com/index.html頁面得到如下內(nèi)容:
如此锦援,我們便使用jquery的寫法實(shí)現(xiàn)了jsonp跨域訪問其他站點(diǎn)數(shù)據(jù)猛蔽。
下面我們來看看第二種方式,第二種方式相對(duì)簡(jiǎn)單一點(diǎn):
(1)http://a.com/index.html代碼如下:
(2)http://b.com/index.php代碼如下:
(3)請(qǐng)求http://a.com/index.html頁面得到如下內(nèi)容:
$.getJSON一共有3個(gè)參數(shù):
url:發(fā)送請(qǐng)求地址灵寺,上圖中http://b.com/index.php?myCallback=?曼库,myCallback后面的值為問號(hào)的話,jquery會(huì)默認(rèn)傳一個(gè)隨機(jī)的回調(diào)函數(shù)名稱略板。
data:待發(fā)送 Key/value 參數(shù)毁枯。
callback:載入成功時(shí)回調(diào)函數(shù)。
以上就是jsonp跨域請(qǐng)求數(shù)據(jù)的兩種jquery寫法蚯根。