什么是跨域？
跨域，是瀏覽器不能執行其他網站的腳本，是由瀏覽器的同源策略造成的，是瀏覽器對JavaScript實施的安全限制，
同源策略限制了一下行為：
Cookie、LocalStorage 和 IndexDB 無法讀取
DOM 和 JS 物件無法獲取
Ajax請求發送不出去
場景
同源策略
同源策略 是由NetScape（網景公司）提出的一個著名的安全策略，它是瀏覽器最核心也最基本的安 全功能
所謂的同源，指的是協議，域名，埠相同，瀏覽器處于安全方面的考慮，只允許本域 名下的介面互動，不同源的客戶端腳本，在沒有明確授權的情況下，不能讀寫對方的資源
跨域的解決方法
1、jsonp方式
jsonp的原理就是利用script標簽沒有跨域限制，通過script標簽src屬性，發送帶有callback引數的GET請求，服務端將介面回傳資料拼湊到callback函式中，回傳給瀏覽器，瀏覽器決議執行，從而前端拿到callback函式回傳的資料，
2、cors（目前最流行的跨域方案）
CORS是一個W3C標準，全稱是"跨域資源共享"（Cross-origin resource sharing），
它允許瀏覽器向跨源服務器，發出XMLHttpRequest請求，從而克服了AJAX只能同源使用的限制，
CORS需要瀏覽器和服務器同時支持，目前，所有瀏覽器都支持該功能，IE瀏覽器不能低于IE10，
瀏覽器將CORS跨域請求分為簡單請求和非簡單請求，
只要同時滿足一下兩個條件，就屬于簡單請求
(1)使用下列方法之一：
-
head
-
get
-
post
(2)請求的Heder是 -
Accept
-
Accept-Language
-
Content-Language
-
Content-Type: 只限于三個值：application/x-www-form-urlencoded、multipart/form-data、text/plain
不同時滿足上面的兩個條件，就屬于非簡單請求，瀏覽器對這兩種的處理，是不一樣的，
3、nginx代理跨域
ginx代理跨域，實質和CORS跨域原理一樣，通過組態檔設定請求回應頭Access-Control-Allow-Origin…等欄位，
1）nginx配置解決iconfont跨域
??瀏覽器跨域訪問js、css、img等常規靜態資源被同源策略許可，但iconfont字體檔案(eot|otf|ttf|woff|svg)例外，此時可在nginx的靜態資源服務器中加入以下配置，
2）nginx反向代理介面跨域
跨域問題：同源策略僅是針對瀏覽器的安全策略，服務器端呼叫HTTP介面只是使用HTTP協議，不需要同源策略，也就不存在跨域問題，
實作思路：通過Nginx配置一個代理服務器域名與domain1相同，埠不同）做跳板機，反向代理訪問domain2介面，并且可以順便修改cookie中domain資訊，方便當前域cookie寫入，實作跨域訪問，
#proxy服務器
server {
listen 81;
server_name www.domain1.com;
location / {
proxy_pass http://www.domain2.com:8080; #反向代理
proxy_cookie_domain www.domain2.com www.domain1.com; #修改cookie里域名
index index.html index.htm;
# 當用webpack-dev-server等中間件代理介面訪問nignx時，此時無瀏覽器參與，故沒有同源限制，下面的跨域配置可不啟用
add_header Access-Control-Allow-Origin http://www.domain1.com; #當前端只跨域不帶cookie時，可為*
add_header Access-Control-Allow-Credentials true;
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/273327.html
標籤：其他
上一篇：n行Python代碼系列：五行代碼實作兩個視頻畫中畫播放
下一篇：MySQL常用存盤引擎詳解