常見跨域解決辦法(二)----CORS、postMessage

CORS

CORS 須要瀏覽器和後端同時支持。IE8和9須要經過XDomainRequest實現。
瀏覽器會自動進行CORS通訊,實現CORS通訊的關鍵是後端,只要後端實現了CORS,就實現了跨域。

實現方式

  • 服務端設置Access-Control-Allow-Origin,該屬性表示哪些域名能夠訪問資源,若是設置通配符*,則表示全部網站均可以訪問資源。

postMessage

window.postMessage() 方法能夠安全地實現跨源通訊,可實現跨文本檔、多窗口、跨域消息傳遞。

使用場景

  • 頁面和其餘打開的新窗口的數據傳遞
  • 多窗口之間消息傳遞
  • 頁面與嵌套的iframe消息傳遞

參數介紹(官網文檔:https://developer.mozilla.org...

otherWindow.postMessage(message, targetOrigin, [transfer]);
  • message: 將要發送到其餘window的數據
  • targetOrigin:經過窗口的origin屬性來指定哪些窗口能接收到消息,可設置爲url或通配符*。發送消息時,若是目標窗口的協議、主機地址、端口號三者的任意一項不匹配targetOrigin提供的值,那麼消息就不會被髮送,只有三者徹底匹配,消息纔會被髮送
  • transfer:該參數可選,是一串和message 同時傳遞的 Transferable 對象. 這些對象的全部權將被轉移給消息的接收方,而發送一方將再也不保有全部權。
相關文章
相關標籤/搜索