跨域問題

名詞解釋:

跨域:

瀏覽器對於javascript的同源策略的限制,例如a.cn下面的js不能調用b.cn中的js,對象或數據(由於a.cn和b.cn是不一樣域),因此跨域就出現了.

上面提到的,同域的概念又是什麼呢??? 簡單的解釋就是相同域名,端口相同,協議相同

 

同源策略:

請求的url地址,必須與瀏覽器上的url地址處於同域上,也就是域名,端口,協議相同.

好比:我在本地上的域名是study.cn,請求另一個域名一段數據

 

 

 

 

1.什麼是跨域問題？（安全問題）

兩個項目之間使用Ajax(前端)，相似於後端的httpclient(java中)，實現通信，若是瀏覽器訪問的域名地址，與Ajax訪問的地址不一致的狀況下，默認瀏覽器會有安全機制（同源策略），這個機制致使跨域問題，會沒法獲取到返回結果。

瀏覽器跨域問題產生的緣由：若是使用Ajax請求調用第三方接口，若是Ajax訪問的接口域名和端口號與瀏覽器訪問（啓動時的頁面）的域名和端口號不一致的狀況下，就會產生跨域問題（屬於瀏覽器安全問題）

跨域問題的請求是能夠訪問的，可是隻是獲取不到結果。
可是將Ajax發送的url直接在瀏覽器地址欄進行訪問是沒問題的。（就不會發生跨域問題）

##################跨域問題的解決方案？
（1）使用JsonP解決跨域問題（不推薦，由於只能支持get請求，不支持post請求）
（2）使用HttpClient進行轉發（不推薦，由於效率很是低，會發送兩次請求）

（3）設置響應頭容許跨域（能夠推薦）

（4）使用Nginx搭建API接口網關（強烈建議），由於保證域名和端口都一致，以項目區分反向代理到真實服務器地址。

（5）使用Zuul微服務器搭建API接口網管（強烈推薦）SpringCloud

 

################(1)設置響應頭，解決跨域問題************
被訪問服務器設置響應頭：
"ACCESS-Control-Allow-Origin","*" # 告訴瀏覽器，容許跨域。
「*」表明全部域名均可以訪問（能夠和我本身的域名不一樣）

######適合於小公司快速解決問題。

 

###############（2）使用JsonP解決跨域問題**************

在Ajax中設置請求頭：
dataType:"jsonp",
jsonp:"jsonpCallback", //會在發送的url後加一個隨機數參數。