何為跨域？

跨域，指的是從一個域名去請求另外一個域名的資源。即跨域名請求！跨域時，瀏覽器不能執行其他域名網站的指令碼，是由瀏覽器的同源策略造成的，是瀏覽器施加的安全限制。

例如：a頁面想獲取b頁面資源，如果a、b頁面的協議、域名、埠、子域名不同，所進行的訪問行動都是跨域的，而瀏覽器為了安全問題一般都限制了跨域訪問，也就是不允許跨域請求資源。

同源策略：是指協議，域名，埠都要相同，其中有一個不同都會產生跨域；

具體理解：

http://www.123.com --> http://www.123.com 非跨域

http://www.123.com --> http://admin.123.com 跨域 ----> 域名不同

http://www.123.com --> http://www.456.com 跨域 ----> 域名不同

http://www.123.com:8081 --> http://www.funtl.com:8080 跨域 ---->埠號不同

http://www.123.com --> https://www.123.com 跨域 ----->協議不同

為什麼要跨域？

現實工作開發中經常會有跨域的情況，因為公司會有很多專案，也會有很多子域名，各個專案或者網站之間需要相互呼叫對方的資源，避免不了跨域請求。

如何解決跨域

最簡單的解決方法，就是把瀏覽器設為忽略安全問題，設定--disable-web-security。不過只能用於開發pc端的頁面，到移動端就不行了。

1、JSONP（JSON with Padding）方式，

它是JSON的一種”使用模式”，可用於解決主流瀏覽器的跨域資料訪問的問題。由於同源策略，兩個跨域的網頁不能進行溝通，而 HTML 的script 元素是一個例外。所以利用<script>元素的這個開放策略，網頁可以得到從其他來源動態產生的 JSON 資料。用 JSONP 抓到的資料並不是 JSON，而是任意的JavaScript，用 JavaScript 直譯器執行而不是用 JSON 解析器解析。 JSONP請求一定需要對方的伺服器做支援才可以。

要注意 ：JSONP只支援GET請求，不支援POST請求。

優點是相容性好，可用於解決主流瀏覽器的跨域資料訪問的問題。

缺點是僅支援get方法具有侷限性。

2、CORS方式

整個CORS通訊過程，都是瀏覽器自動完成，不需要使用者參與。瀏覽器一旦發現AJAX請求跨源，就會自動新增一些附加的頭資訊，有時還會多出一次附加的請求。因此，實現CORS通訊的關鍵是伺服器。只要伺服器實現了CORS介面，就可以跨源通訊。

CORS要求瀏覽器和伺服器的同時支援，是跨域的根本解決方法，由瀏覽器自動完成。

優點在於功能更加強大支援各種HTTP Method，缺點是相容性不如JSONP。

在響應頭上新增Access-Control-Allow-Origin屬性，指定同源策略的地址。同源策略預設地址是網頁的本身。只要瀏覽器檢測到響應頭帶上了CORS，並且允許的源包括了本網站，那麼就不會攔截請求響應。

3、NGINX方式

a網站向b網站請求檔案時，向b網站傳送一個獲取的請求，nginx根據配置檔案接收這個請求，代替a網站向b網站來請求這個資源，nginx拿到這個資源後再返回給a網站，以此來解決了跨域問題。

server {
        #監聽8000埠
        listen       8000;
        #監聽指定的ip地址
        server_name  10.10.2.116;
        #對對應url路徑執行反向代理,如10.10.2.116:8000/demo
        location /demo {
        #目標的ip地址
            proxy_pass http://10.10.2.116:10037; 
        }
}

這樣就可以訪問10.10.2.116的8000埠來獲取同ip下10037埠下的相應資源，解決跨域。

看完這篇文章的感悟

公司中的業務會同時啟動多個服務，各個服務之前又有相互關聯，要實現相互之間的訪問，解決辦法就是使用Nginx的反向代理 -九五小龐
————————————————
版權宣告：本文為CSDN博主「weixin_43996959」的原創文章，遵循CC 4.0 BY-SA版權協議，轉載請附上原文出處連結及本宣告。
原文連結：https://blog.csdn.net/weixin_43996959/article/details/103091455