除了jsonp這個主流的解決方案外,還有其他四個常用的跨域請求方案適用於不同的場景。
# ping
可以從任何url中載入,故將img的src設定成其他域的url,即可實現跨域。還有乙個注意的地方是的載入是非同步的,所以把的渲染必須放到回掉函式onload中,具體看以下示例**:
#cors(跨資源共享)ie例項化了xdr物件(xdomainrequest),該物件只能訪問到responsetext,用onerror()檢測異常,用onload檢測請求出成功,其他和xhr物件方法幾乎沒區別。其他主流瀏覽器像ff,chrome例項化了xhr物件(xmlhttprequest),和ajax一樣,但是url要使用絕對位址。其中的限制:
#document.domain(解決不同域框架見的通訊問題)
1.父框架只能獲取子框架中的window物件(但該物件毫無用處,既不能用該物件對獲取子框架中的其他屬性),如下**會報錯:
2.在父框架和子框架的js**中設定document.domain為兩個框架中頁面所在的主域,前提兩個頁面的主域必須相同,不然該方法無效的。
#window.name
1.原理:在同一視窗的生命週期內載入的所有頁面共用window.name屬性,同時擁有讀寫許可權。
比如在本地index.html設定name的值,在2秒後載入伺服器b.html頁面,b.html可以獲取之前index.html設定的值。
index.html:
b.html:
結果:
2.以上就是利用window.name進行跨域的原形,那麼如何做到不重新整理url的前提下獲取跨域頁面的window.name的值?
--在本地的index頁面中加入乙個隱藏的框架iframe,src先設定為我們要載入的遠端伺服器的頁面url,並且在遠端頁面中把要傳輸資訊封裝成字串設定為window.name的值,在iframe載入完遠端頁面後設定為本地隨便的乙個頁面,這樣最外層框架top才能獲取自框架的window.name的值,不然會造成跨域限制。
index.html
伺服器頁面**b.html:
這樣就完成了利用window.name進行跨域資訊交換。以上就是現在常用的集中跨域解決方案,另外html5也有相應的api,回去再擼!
相關資料鏈結
ajax跨域請求方法
一 為什麼會需要ajax跨域,為什麼會出現跨域請求?為保護使用者資訊保安,瀏覽器引入同源政策 same origin policy 同源指的是什麼相同呢?協議相同 網域名稱相同 埠號相同 當非同源時會 cookie localstorage 無法讀取 dom無法獲取 ajax請求無法傳送 所以,當a...
跨域請求資源的方法
參考 1 porxy 定義和用法 proxy 用於將請求傳送給後台伺服器,通過伺服器來傳送請求,然後將請求的結果傳遞給前端。實現方法 通過nginx 注意點 1 如果你 的是https協議的請求,那麼你的proxy首先需要信任該證書 尤其是自定義證書 或者忽略證書檢查,否則你的請求無法成功。2 co...
跨域請求方法之CORS
常見跨域請求資源的方法之cors 跨域請求資源的方法 1 cors cross origin resource sharing 瀏覽器支援跨域最常用的一種方法。res.writehead 200,注意 伺服器使用node中egg框架時,在使用axios庫請求時,需要設定 cors credentia...