什麼是瀏覽器跨域訪問操作?JS如何實現?
什麼是瀏覽器跨域訪問操作?js如何實現?
1.什麼是跨域?
JavaScript出於安全方面的考慮做的同源策略的限制,不允許跨域訪問其他資源。通常跨域請求成功後,瀏覽器會拒絕響應伺服器端返回的結果。
2. 怎麼樣算是跨域?
如下相對http://store.company.com/dir/page.html同源檢測的示例:
注意:域名與其對應的ip也不能成功訪問
javascript跨域訪問是web開發者經常遇到的問題,什麼是跨域,一個域上載入的指令碼獲取或操作另一個域上的文件屬性,下面將列出三種實現javascript跨域方法:
1.基於iframe實現跨域
基於iframe實現的跨域要求兩個域具有aa.xx.com,bb.xx.com這種特點,也就是兩個頁面必須屬於一個基礎域(例如都是xxx.com,或是xxx.com.cn),使用同一協議(例如都是 http)和同一埠(例如都是80),這樣在兩個頁面中同時新增document.domain,就可以實現父頁面呼叫子頁面的函式,程式碼如下:
頁面一:
Html程式碼
頁面二:
Html程式碼 收藏程式碼
這時候父頁面就可以呼叫子頁面的a函式,實現js跨域訪問
2.基於script標籤實現跨域
script標籤本身就可以訪問其它域的資源,不受瀏覽器同源策略的限制,可以通過在頁面動態建立script標籤,程式碼如下:
Java程式碼
var script = document.createElement(‘script’);
script.src = “http://aa.xx.com/js/*.js”;
document.body.appendChild(script);
這樣通過動態建立script標籤就可以載入其它域的js檔案,然後通過本頁面就可以呼叫載入後js檔案的函式,這樣做的缺陷就是不能載入其它域的文件,只能是js檔案,jsonp便是通過這種方式實現的,jsonp通過向其它域傳入一個callback引數,通過其他域的後臺將callback引數值和json串包裝成javascript函式返回,因為是通過script標籤發出的請求,瀏覽器會將返回來的字串按照javascript進行解析執行,實現了域與域之間的資料傳輸。
jquery中對jsonp的支援也是基於此方案。
3.後臺代理方式
這種方式可以解決所有跨域問題,也就是將後臺作為代理,每次對其它域的請求轉交給本域的後臺,本域的後臺通過模擬http請求去訪問其它域,再將返回的結果返回給前臺,這樣做的好處是,無論訪問的是文件,還是js檔案都可以實現跨域。
出處:https://www.cnblogs.com/mq0036/p/5656680.html
相關文章
- 跨域訪問是什麼!怎麼解決?跨域
- 瀏覽器跨域瀏覽器跨域
- 詳解瀏覽器跨域訪問的幾種辦法瀏覽器跨域
- js 判斷是什麼瀏覽器、是否為谷歌瀏覽器JS瀏覽器谷歌
- Laravel 瀏覽器跨域Laravel瀏覽器跨域
- 谷歌瀏覽器跨域谷歌瀏覽器跨域
- 新版 google 谷歌瀏覽器跨域問題Go谷歌瀏覽器跨域
- 如何使用css實現跨瀏覽器的最小高度?CSS瀏覽器
- 一文解決瀏覽器跨域問題瀏覽器跨域
- Mac下chrome瀏覽器跨域MacChrome瀏覽器跨域
- win10 edge瀏覽器快捷鍵是什麼 win10 edge瀏覽器快捷鍵如何操作Win10瀏覽器
- edge是什麼瀏覽器 microsoft edge是ie瀏覽器嗎瀏覽器ROS
- JS實現瀏覽器列印WordJS瀏覽器
- 火狐 和 谷歌Google Chrome 核心瀏覽器 跨域問題谷歌GoChrome瀏覽器跨域
- 徹底理解瀏覽器的跨域瀏覽器跨域
- 解決JS跨域訪問的問題JS跨域
- 什麼是跨域跨域
- 為什麼跨瀏覽器測試很重要?7款跨瀏覽器測試工具請查收!瀏覽器
- JavaScript 跨域訪問(API介面)實現原理分析JavaScript跨域API
- 啟動google 瀏覽器允許跨域Go瀏覽器跨域
- 什麼是跨域,後端工程師如何處理跨域跨域後端工程師
- 一文搞懂│什麼是跨域?如何解決跨域?跨域
- 【JavaScript】通過封裝自己的JSONP解決瀏覽器的跨域問題(Ajax跨域)JavaScript封裝JSON瀏覽器跨域
- SQL Server跨庫跨伺服器訪問實現SQLServer伺服器
- 什麼是原子操作?Java如何實現原子操作?Java
- 詳解瀏覽器跨域的幾種方法瀏覽器跨域
- localStorage 跨域訪問跨域
- 什麼是Tor?Tor瀏覽器更新有什麼用?瀏覽器
- 為什麼谷歌瀏覽器開啟是2345瀏覽器 谷歌瀏覽器一開啟是2345介面怎麼辦谷歌瀏覽器
- 通過瀏覽器訪問一個 PHP 檔案時發生了什麼?瀏覽器PHP
- 介紹什麼是同源和什麼是跨域,以及三種解決跨域問題的路徑跨域
- Java是如何實現跨平臺的?原理是什麼?Java
- 瀏覽器同源策略及 Ajax 跨域解決方案瀏覽器跨域
- 設定谷歌瀏覽器跨域(本地除錯可用)谷歌瀏覽器跨域除錯
- 跨源通訊、跨域訪問跨域
- js -- 跨域問題JS跨域
- iframe 元素跨域訪問跨域
- 怎麼清除瀏覽器快取?瀏覽器快取清理的方法步驟是什麼?瀏覽器快取