什么是跨域？
瀏覽器從一個域名的網頁去請求另一個域名的資源時，域名、端口、協議任一不同，都是跨域
域名：
主域名不同 http://www.baidu.com/index.html -->http://www.sina.com/test.js
子域名不同 http://www.666.baidu.com/index.html -->http://www.555.baidu.com/test.js
域名和域名ip http://www.baidu.com/index.html -->http://180.149.132.47/test.js
端口：
http://www.baidu.com:8080/index.html–> http://www.baidu.com:8081/test.js
協議：
http://www.baidu.com:8080/index.html–> https://www.baidu.com:8080/test.js
備注：
1、端口和協議的不同，只能通過后台來解決
2、localhost和127.0.0.1雖然都指向本機，但也屬於跨域
一、為什么會出現跨域問題
出於瀏覽器的同源策略限制。同源策略（Sameoriginpolicy）是一種約定，它是瀏覽器最核心也最基本的安全功能，如果缺少了同源策略，則瀏覽器的正常功能可能都會受到影響。可以說Web是構建在同源策略基礎之上的，瀏覽器只是針對同源策略的一種實現。同源策略會阻止一個域的javascript腳本和另外一個域的內容進行交互。所謂同源（即指在同一個域）就是兩個頁面具有相同的協議（protocol），主機（host）和端口號（port）
二、什么是跨域
當一個請求url的協議、域名、端口三者之間任意一個與當前頁面url不同即為跨域
當前頁面url 被請求頁面url 是否跨域 原因
當前頁面url 被請求頁面url 是否跨域 原因
| URL | 說明 | 是否允許通信 |
|---|---|---|
| http://www.a.com/a.js http://www.a.com/b.js |
同一域名下 | 允許 |
| http://www.a.com/lab/a.js http://www.a.com/script/b.js |
同一域名下不同文件夾 | 允許 |
| http://www.a.com:8000/a.js http://www.a.com/b.js |
同一域名，不同端口 | 不允許 |
| http://www.a.com/a.js https://www.a.com/b.js |
同一域名，不同協議 | 不允許 |
| http://www.a.com/a.js http://70.32.92.74/b.js |
域名和域名對應ip | 不允許 |
| http://www.a.com/a.js http://script.a.com/b.js |
主域相同，子域不同 | 不允許 |
| http://www.a.com/a.js http://a.com/b.js |
同一域名，不同二級域名（同上） | 不允許（cookie這種情況下也不允許訪問） |
| http://www.cnblogs.com/a.js http://www.a.com/b.js |
不同域名 | 不允許 |
三、非同源限制
【1】無法讀取非同源網頁的 Cookie、LocalStorage 和 IndexedDB
【2】無法接觸非同源網頁的 DOM
【3】無法向非同源地址發送 AJAX 請求
解決方案：
一、使用nginx 的add_header 指令，這個指令可以添加一些頭信息。
這個方法的缺點是，不是所有的瀏覽器都支持Access-Control-Allow-origin，不能完全規避跨域。
add Access-Control-Allow-Origin:*; #則允許所有域名的腳本訪問該資源。
add Access-Control-Allow-Methods POST, GET, OPTIONS, DELETE;
二、使用nginx的反向代理