跨域的幾種方式

2022-08-19 12:48:16 字數 1797 閱讀 3356

原理是自定義http頭部origin,這個部分由瀏覽器控制,這個過程與cookie無關。

例如:origin:

伺服器判讀origin的值是否在自己白名單當中,如果是,返回access-control-allow-origin: ""

當訪問伺服器的資源為公共資源時,也就是伺服器不限制請求**時,返回access-control-allow-origin: "*"

原理是建立乙個

例項,設定src進行單向通訊,只能傳送get請求

var img = new image();

img.onload = img.onerror = function()

img.src = ""

原理是通過動態建立script標籤完成

function handler(res) 

var script = document.createelement("script");

script.src = "?callback="handler"";

document.body.insertbefore(script, document.body.firstchild);

是一種伺服器向頁面推送資料技術。

有兩種實現方式:長輪詢http流

長輪詢

瀏覽器向伺服器傳送連線請求,瀏覽器就一直保持連線開啟狀態,伺服器有資料時便傳送資料到瀏覽器,瀏覽器關閉連線。然後再次傳送連線請求。

http流

瀏覽器向伺服器傳送一次連線請求,伺服器一直保持連線開啟狀態。瀏覽器即使接受資料了也不會斷開連線。

圍繞著comet推出的api

var source = new eventsource(url); //url 必須與source建立物件的頁面同源。

source.onmessage = function(event)

source.close(); // 手動關閉連線

在乙個單獨的持久連線上提供全雙工、雙向通訊。

wx:// 或 wss:// 為協議名

var socket = new websocket("ws:");

// 成功連線後

socke.onopen = function()

// 連線發生錯誤

socket.onerror = function(err)

// 傳送資料

socket.send("test message");

// 接受資料

socket.onmessage = function(event)

socket.close() // 關閉socket連線

html5 window.postmessage 是乙個安全的、基於事件的訊息api,可用於html內嵌iframe、window.open()新視窗之間的通訊。

//傳送資訊

window.postmessage(msg, url);

//接收postmessage資訊

window.addeventlistener("message", func, false);

function func(event)

跨域的幾種方式

協議 埠號 網域名稱 都相同才是同乙個域 只要有乙個不同就算是跨域 主網域名稱相同,子網域名稱不同也算跨域 email.qq.com和zone.qq.com就屬於主域相同,子域不同,也算是跨域 需要注意的是 協議不同 eg https和http 或者埠號不同造成的跨域,前端是無法解決的 實際工作中,...

跨域的幾種實現方式

jsonp ajax error function 伺服器設定響應頭,允許跨域 一般不建議這樣做 res.header access control allow origin 伺服器 伺服器與伺服器之間沒有跨域問題.可以讓本機伺服器作為 來請求第三方伺服器,然後將第三方伺服器資料返回回來,但是不會攜...

解決跨域的幾種方式

1.document.domain 由於js同源策略的限制,指令碼只能讀取和所屬文件 相同的視窗和文件屬性 對於有公共的上級網域名稱,這些伺服器上的頁面之間的跨域訪問可以通過document.domain來進行 預設document.domain存放的是載入文件的伺服器的主機名,可以手動設定這個屬性...