1. 程式人生 > >工作隨記:jsonp跨域介面測試

工作隨記:jsonp跨域介面測試

原先測過這個介面,前後端同源(域名,協議,埠相同),開發提供的文件:

 

$.post("http://host/url",
    {
        data1: "data1",
        data2: "data2",
        data3: "data3"
    },
  function(data){console.log(JSON.stringify(data))}
)
測試介面發出的請求和響應如下: 響應是json格式
請求:
post
http://host/url post data: data1=data1&data2=data2&data3=data3 響應: {
"retCode": null, "retMsg": null, "isSucess": true, "message": { "id": "100001" }}

 

現在其他系統需要請求該資料,json跨域需改成jsonp。改成jsonp之後,開發提供的文件:
$.ajax({
    url: "http://host/url", //請求地址
    type: "GET",  //請求方式變了
    dataType: "JSONP", //資料格式設定jsonp
    jsonp:"callback",  //驗證引數的名稱
    data: {
        data1: "data1",
        data2: 
"data2", data3: "data3" }, success: function (data) { console.log(JSON.stringify(data)) } });
 
測試介面發出的請求如下響應結果返回格式:函式(引數),引數=json串
簡單理解(深入的網上找資料吧): 前端跨域發起請求時,指定函式; 獲取到響應之後再呼叫該函式解析出裡面包含的json串,從而實現跨域資料訪問。
 
 
 
JSONP請求:
get
http://host/url param: callback=testcallback&data1=data1&data2=data2&data3=data3 #post請求變成了get請求,且多了一個引數testcallback函式是開發設定的
響應:
testcallback({"retCode": null, "retMsg": null, "isSucess": true, "message": { "id": "100001" }}) 
 


關於是否同源:

 



the end!