日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當前位置: 首頁 > 前端技术 > HTML >内容正文

HTML

浏览器的同源限制解决方案

發布時間:2025/1/21 HTML 100 豆豆
生活随笔 收集整理的這篇文章主要介紹了 浏览器的同源限制解决方案 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

2019獨角獸企業重金招聘Python工程師標準>>>

1.對于不同的二級域名中的cookie共享
php中的setcookie函數的第四個參數,只寫一級域名即可,如:

?setcookie('key', $value, $ttl, '.baidu.com');

2.網頁中用iframe嵌入一個不同源的網頁
不同源則雙方無法拿到對方的dom,即下面的語句會報錯:

document.getElementById("myIFrame").contentWindow.document;

方法一:利用js設置document.domain 實現跨域,前提條件:這兩個域名必須屬于同一個基礎域名!而且所用的協議,端口都要一致,否則會報"參數無效錯誤。"。
比如在:aaa.com的一個網頁(a.html)里面利用iframe引入了bbb.com里的一個網頁(b.html)。
這時在a.html里面可以看到b.html里的內容,但是卻不能利用javascript來操作它。因為這兩個頁面屬于不同的域,在操作之前,js會檢測兩個頁面的域是否相等,如果相等,就允許其操作,如果不相等,就會拒絕操作。
這里也不可能把a.html與b.html利用JS改成同一個域的。因為它們的基礎域名不相等。(強制用JS將它們改成相等的域的話會報"參數無效錯誤。")
有另一種情況,兩個子域名:
  aaa.xxx.com
  bbb.xxx.com
aaa里的一個網頁(a.html)引入了bbb 里的一個網頁(b.html),這時a.html里同樣是不能操作b.html里面的內容的。因為document.domain不一樣,一個是aaa.xxx.com,另一個是bbb.xxx.com。這時我們就可以通過Javascript,將兩個頁面的domain改成一樣的,需要在a.html里與b.html里都加入代碼如下:

document.domain = "xxx.com";

這樣這兩個頁面就可以互相操作了。也就是實現了同一基礎域名之間的"跨域"。


方法二:如果只是想在兩個窗口間傳遞數據,可以利用url中的hash
父窗口可以把信息,寫入子窗口的hash中:

?? ?var src = originURL + '#' + data;document.getElementById('myIFrame').src = src;

子窗口通過監聽hashchange事件得到通知,獲取數據:

window.onhashchange = function() {var message = window.location.hash;// ...}

同樣的,子窗口也可以改變父窗口的片段標識符:

?? ?parent.location.href= target + "#" + hash;

?

方法三:利用html5提供的接口方法window.postMessage,在跨窗口通信中,允許這兩個窗口不同源。
父窗口http://aaa.com向子窗口http://bbb.com發消息,調用postMessage方法就可以了:

?? ?var popup = window.open('http://bbb.com', 'title');popup.postMessage('Hello World!', 'http://bbb.com');

postMessage方法的第一個參數是具體的信息內容,第二個參數是接收消息的窗口的源(origin),即"協議 + 域名 + 端口"。也可以設為*,表示不限制域名,向所有窗口發送。
子窗口向父窗口發送消息的寫法類似:

?? ?window.opener.postMessage('Nice to see you', 'http://aaa.com');

父窗口和子窗口都可以通過message事件,監聽對方的消息:

?? ?window.addEventListener('message', function(e) {console.log(e.data);},false);//message事件的事件對象event,提供以下三個屬性://event.source:發送消息的窗口//event.origin: 消息發向的網址//event.data: 消息內容

3.通過ajax向不同的源請求數據
方法一:JSONP
它的基本思想是,網頁通過添加一個<script>元素,向服務器請求JSON數據,這種做法不受同源政策限制;服務器收到請求后,將數據放在一個指定名字的回調函數里傳回來。但是它只能發送GET請求。
首先,網頁動態插入<script>元素,由它向跨源網址發出請求:

function addScriptTag(src) {var script = document.createElement('script');script.setAttribute("type","text/javascript");script.src = src;document.body.appendChild(script);}window.onload = function () {addScriptTag('http://example.com/ip?callback=foo');}function foo(data) {console.log('Your public IP address is: ' + data.ip);};


服務器收到這個請求以后,會將數據放在回調函數的參數位置,以字符串的形式返回:

?? ?echo 'foo({"ip": "8.8.8.8"})';


由于<script>元素請求的腳本,直接作為代碼運行。這時,只要瀏覽器定義了foo函數,該函數就會立即執行。

方法二:CORS

比較復雜 http://www.ruanyifeng.com/blog/2016/04/cors.html

轉載于:https://my.oschina.net/codespring/blog/715725

總結

以上是生活随笔為你收集整理的浏览器的同源限制解决方案的全部內容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。