什麼是跨域？
1.什麼是同源策略及其限制內容？
同源策略是一種約定，它是瀏覽器最核心也最基本的安全功能，如果缺少了同源策略，瀏覽器很容易受到xss、csrf等攻擊。所謂同源是指"協議+網域名稱+埠"三者相同，即便兩個不同的網域名稱指向同乙個ip位址，也非同源。
同源策略限制內容有：
cookie、localstorage、indexeddb 等儲存性內容
dom 節點
ajax 請求傳送後，結果被瀏覽器攔截了
但是有三個標籤是允許跨域載入資源：
6.nginx反向**
實現原理類似於node中介軟體**，需要你搭建乙個中轉nginx伺服器，用於**請求。
使用nginx反向**實現跨域，是最簡單的跨域方式。只需要修改nginx的配置即可解決跨域問題，支援所有瀏覽器，支援session，不需要修改任何**，並且不會影響伺服器效能。
實現思路：通過nginx配置乙個**伺服器（網域名稱與domain1相同，埠不同）做跳板機，反向**訪問domain2介面，並且可以順便修改cookie中domain資訊，方便當前域cookie寫入，實現跨域登入。
// proxy伺服器
server 最後通過命令列 nginx-s reload啟動nginx
// 前端開關：瀏覽器是否讀寫cookie
xhr.withcredentials = true;
// 訪問nginx中的**伺服器
window.name屬性的獨特之處：name值在不同的頁面（甚至不同網域名稱）載入後依舊存在，並且可以支援非常長的 name 值（2mb）。
其中a.html和b.html是同域的，都是 http://localhost:3000;而c.html是 http://localhost:4000。
b.html為中間**頁，與a.html同域，內容為空。
總結：通過iframe的src屬性由外域轉向本地域，跨域資料即由iframe的window.name從外域傳遞到本地域。這個就巧妙地繞過了瀏覽器的跨域訪問限制，但同時它又是安全操作。
8.location.hash + iframe
實現原理： a.html欲與c.html跨域相互通訊，通過中間頁b.html來實現。 三個頁面，不同域之間利用iframe的location.hash傳值，相同域之間直接js訪問來通訊。
具體實現步驟：一開始a.html給c.html傳乙個hash值，然後c.html收到hash值後，再把hash值傳遞給b.html，最後b.html將結果放到a.html的hash值中。 同樣的，a.html和b.html是同域的，都是 http://localhost:3000;而c.html是 http://localhost:4000。
該方式只能用於二級網域名稱相同的情況下，比如 a.test.com 和 b.test.com 適用於該方式。 只需要給頁面新增 document.domain=『test.com』 表示二級網域名稱都相同就可以實現跨域。
實現原理：兩個頁面都通過js強制設定document.domain為基礎主域，就實現了同域。
我們看個例子：頁面 a.zf1.cn:3000/a.html獲取頁面
b.zf1.cn:3000/b.html中a的值。
// a.html
helloa
src="" id="frame">
// b.html
hellob
九種跨域方式實現原理
前後端資料互動經常會碰到請求跨域，什麼是跨域，以及有哪幾種跨域方式，這是本文要 的內容。本文完整的源 請猛戳github 部落格 同源策略是一種約定，它是瀏覽器最核心也最基本的安全功能，如果缺少了同源策略，瀏覽器很容易受到 xss csfr 等攻擊。所謂同源是指 協議 網域名稱 埠 三者相同，即便兩...
JavaScript 九種跨域方式實現原理
前言 前後端資料互動經常會碰到請求跨域，什麼是跨域，以及有哪幾種跨域方式，這是本文要 的內容。一 什麼是跨域？1.什麼是同源策略及其限制內容？同源策略是一種約定，它是瀏覽器最核心也最基本的安全功能，如果缺少了同源策略，瀏覽器很容易受到 xss csfr 等攻擊。所謂同源是指 協議 網域名稱 埠 三者...
js跨域 ajax跨域 跨域方式（前端）
跨域方式 cors 跨域資源共享 當使用xmlhttprequest傳送請求時，瀏覽器會自動加上乙個請求頭 origin,後端在接受到請求後確定響應後會在response headers中加入乙個屬性 access control allow origin,值就是發起請求的源位址 瀏覽器得到響應會進...