Jsonp的跨域詳析

2021-08-30 17:37:15 字數 1274 閱讀 2210

什麼是跨域訪問

在a**中,我們希望使用ajax來獲得b**中的特定內容。如果a**與b**不在同乙個域中,那麼就出現了跨域訪問問題。同源策略規定,瀏覽器的ajax只能訪問跟它的html頁面同源(相同網域名稱或ip)的資源。

什麼是jsonp

jsonp(json with padding)是json的一種「使用模式」,可用於解決主流瀏覽器的跨域資料訪問的問題。由於同源策略,一般來說位於 server1.example.com 的網頁無法與不是 server1.example.com的伺服器溝通,而 html 的

jsonp的使用

$.ajax(,

error: function (e)

});

jsonp原理

後端要配合使用jsonp,那麼首先得了解jquery ajax jsonp的乙個特點:

jquery在傳送乙個ajax jsonp請求時,會在訪問鏈結的後面自動加上乙個驗證引數,這個引數是jquery隨機生成的,例如鏈結

=1512186387046

中,引數callback=jquery31106628680598769732_1512186387045&=1512186387046就是jquery自動新增的。

新增這個引數的目的是唯一標識這次請求。當伺服器端接收到該請求時,需要將該引數的值與實際要返回的json值進行構造(如何構造下面講解),並且返回,而前端會驗證這個引數,如果是它之前發出的引數,那麼就會接收並解析資料,如果不是這個引數,那麼就拒絕接受。

需要特別注意的是這個驗證引數的名字,這個名字**於前端的jsonp引數的值。如果把前端jsonp引數的值改為「aaa」,那麼相應的引數就應該是

aaa=jquery31106628680598769732_1512186387045&_=1512186387046

後端接收與處理

@responsebody

public string getmyseatsuccess(@requestparam("callback") string callback)

需要注意的是:

前端注意與後端溝通約定jsonp的值,通常預設都是用callback。

後端根據jsonp引數名獲取到引數後要與本來要返回的json資料按「callback(json)」的方式構造。

如果要測試的話記得在跨域環境(兩台機器)下進行。

JSONP跨域請求

看到jsonp我們會很自然的想到json,但它們卻有很大的不同,json是一種輕量級的資料交換格式,而jsonp可以說是一種非官方的資料互動協議。jsonp json with padding 利用jsonp可以從別的網域名稱下獲取資料,即跨域獲取資料。由於同源策略不允許xmlhttprequest...

jsonp簡單跨域

在web開發的時候難免會遇到跨域求情資料的問題,此時使用jsonp是比較簡便的。a.com網域名稱下的js,是無法訪問網域名稱為b.com下的js的,會報跨域的錯誤 所以你可以動態建立乙個標籤,把他的src屬性設定成你要請求的伺服器的url,如 就等於是使用去向伺服器請求,但是這個是時候伺服器不能直...

jsonp跨域原理

jsonp跨域請求是借助於表單元素的 src 屬性的 跨域 實現的,具體實現如下 1 html頁面 2 服務端 restcontroller public class jsonpcontroller return callback jsonp和ajax並無關係,只是借助了src屬性的 跨域 特性來實...