前端跨域問題如何解決

qwer ?發表於2020-03-18

nginx/cors/http-proxy等為常用的前端處理跨域方式

  1. jsonp 在頁面插入一個 script標籤,位址列增加 cb 函式,後端接受到請求後,返回執行 cb(後端要返回給前端的資料) ,缺點:只支援 get
  2. cors 後端 配置許可權控制允許源,將前端源寫入
  3. postMessage 兩個頁面可以訪問 iframe,一方發 postMessage ,一方接受 onmessage 接受,postMessage 第一個傳資料,第二個傳要傳送目標的源
  4. document.domain 二級域名通訊,子域父域 iframe,父子域分別設定 domain 為同一個
  5. window.name 空字串 ,iframe,需要a/b兩個同源頁面c一個不同源的頁面,a 引用 c, c把資料放在 window.name,把c引用改到b,a/b在同源即可訪問
  6. location.hash iframe 需要 a/b 兩個同源頁面c一個不同源頁面,a傳hash給c,c接受hash資料後,傳資料給b,b尋找到a修改a的hash,將c傳來的資料攜帶過去
  7. http-proxy 中介軟體
  8. nginx,配置 頭,許可權控制允許源,將前端源寫入
  9. websocket 不存在跨域,客戶端用 WebSocket 建立 ws物件, onopen,send傳送資料,onmessage 接受資料,node 端可以使用 ws 包,建立 wss 物件,服務端on('connection')監聽連線,on('message')獲取資料,send傳送資料
    前端跨域問題如何解決

相關文章