什麼是跨域？

跨域是指一個域下的文件或指令碼試圖去請求另一個域下的資源，這裡跨域是廣義的。

什麼是同源策略？
同源策略/SOP（Same origin policy）是一種約定，由Netscape公司1995年引入瀏覽器，它是瀏覽器最核心也最基本的安全功能，如果缺少了同源策略，瀏覽器很容易受到XSS、CSFR等攻擊。所謂同源是指"協議+域名+埠"三者相同，即便兩個不同的域名指向同一個ip地址，也非同源。

同源策略限制以下幾種行為：

1.) Cookie、LocalStorage 和 IndexDB 無法讀取
2.) DOM 和 Js物件無法獲得
3.) AJAX 請求不能傳送

常見跨域場景

URL                                      說明                    是否允許通訊
http:
 
//www.domain.com/a.js
http://www.domain.com/b.js         同一域名，不同檔案或路徑           允許
http://www.domain.com/lab/c.js

http://www.domain.com:8000/a.js
http://www.domain.com/b.js         同一域名，不同埠                不允許
 
http://www.domain.com/a.js
https://www.domain.com/b.js        同一域名，不同協議                不允許
 
http://www.domain.com/a.js
 

http://192.168.4.12/b.js           域名和域名對應相同ip              不允許
 
http://www.domain.com/a.js
http://x.domain.com/b.js           主域相同，子域不同                不允許
http://domain.com/c.js
 
http://www.domain1.com/a.js
http://www.domain2.com/b.js        不同域名                         不允許

通過jsonp跨域

var script = document.createElement('script');
    script.type 
 
= 'text/javascript';

    // 傳參一個回撥函式名給後端，方便後端返回時執行這個在前端定義的回撥函式
    script.src = 'http://www.domain2.com:8080/loginuser=admin&callback=handleCallback';
    document.head.appendChild(script);

    // 回撥執行函式
    function handleCallback(res) {
        alert(JSON.stringify(res));
    }    

跨域資源共享（CORS）

普通跨域請求：只服務端設定Access-Control-Allow-Origin即可，前端無須設定，若要帶cookie請求：前後端都需要設定。

// 前端設定是否帶cookie
xhr.withCredentials = true;