天天看點

jsonp php寫法,jsonp系列(四)jquery下jsonp的寫法

檢視手冊,我們看到,jquery寫jsonp有兩種方式:

1$.ajax的方式

2$.getJSON的方式先來看第一種方式:

(1)http://a.com/index.html代碼如下:

jsonp php寫法,jsonp系列(四)jquery下jsonp的寫法

其中幾個參數需要說明下:

type:代表請求送出的方式

async:是否同步

url:請求位址

dataType:請求的資料類型,是使用jsonp這種跨資料通路協定的json資料格式還是用其他的資料格式

jsonp:有了這個參數,那麼實際請求的url位址會變成http://b.com/index.php?callback=?,如果jsonp設定為test111,那麼請求位址就是http://b.com/index.php?test111=?

jsonpCallback:定義回調函數的名稱,和上面的參數jsonp一起使用,如果這個參數為myCallback,請求的位址會變成http://b.com/index.php?callback=myCallback,另外值得注意的是,如果這個值為空的話,那麼jquery會預設随機生成一個函數名傳過去,那麼實際請求的位址就是:http://b.com/index.php?callback=jquery12253158788754457。

success:請求響應成功的回調

error:請求響應失敗的回調

(2)http://b.com/index.php代碼如下:

jsonp php寫法,jsonp系列(四)jquery下jsonp的寫法

(3)請求http://a.com/index.html頁面得到如下内容:

jsonp php寫法,jsonp系列(四)jquery下jsonp的寫法

如此,我們便使用jquery的寫法實作了jsonp跨域通路其他站點資料。下面我們來看看第二種方式,第二種方式相對簡單一點:

(1)http://a.com/index.html代碼如下:

jsonp php寫法,jsonp系列(四)jquery下jsonp的寫法

(2)http://b.com/index.php代碼如下:

jsonp php寫法,jsonp系列(四)jquery下jsonp的寫法

(3)請求http://a.com/index.html頁面得到如下内容:

jsonp php寫法,jsonp系列(四)jquery下jsonp的寫法

$.getJSON一共有3個參數:

url:發送請求位址,上圖中http://b.com/index.php?myCallback=?,myCallback後面的值為問号的話,jquery會預設傳一個随機的回調函數名稱。

data:待發送 Key/value 參數。

callback:載入成功時回調函數。

以上就是jsonp跨域請求資料的兩種jquery寫法。