瀏覽器和服務器實現跨域(CORS)判定的原理


 

同源策略

同源指的是域名(或IP),協議,端口都相同,不同源的客戶端腳本(javascript、ActionScript)在沒明確授權的情況下,不能讀寫對方的資源。

 

同源的判定:
http://www.example.com/dir/page.html為例,

以下表格指出了不同形式的鏈接是否與其同源:

(原因里未申明不同的屬性即說明其與例子里的原鏈接對應的屬性相同)

 

 

 

什么是跨域?

顧名思義,跨域就是不同的域名下的資源訪問,會被瀏覽器的本地安全策略阻止,例如www.uedsc.com去AJAX請求一個wenda.uedsc.com的資源,他們實際上是不同的兩個二級域名,頂級域名是uedsc.com,就會出現跨域訪問問題。

下面的這張表格可以清晰解釋那些屬於跨域,那時不是屬於跨域

 

 

 

是否允許跨域的判定

前文提到了同源策略的判定,然而同源策略在加強了安全的同時,對開發卻是極大的不便利。因此開發者們又發明了很多辦法來允許數據的跨域傳輸(常見的辦法有JSONPCORS)。當域名不同源的時候,由於跨域實現的存在,瀏覽器不能直接根據域名來判定跨域限制。那么瀏覽器具體又是如何實現判定的呢?看下面的例子。

 

跨域的判定流程

  1. 瀏覽器先根據同源策略對前端頁面和后台交互地址做匹配,若同源,則直接發送數據請求;若不同源,則發送跨域請求。

  2. 服務器解析程序收到瀏覽器跨域請求后,根據自身配置返回對應文件頭。若未配置過任何允許跨域,則文件頭里不包含Access-Control-Allow-origin字段,若配置過域名,則返回Access-Control-Allow-origin對應配置規則里的域名的方式

  3. 瀏覽器根據接受到的http文件頭里的Access-Control-Allow-origin字段做匹配,若無該字段,說明不允許跨域;若有該字段,則對字段內容和當前域名做比對,如果同源,則說明可以跨域,瀏覽器發送該請求;若不同源,則說明該域名不可跨域,不發送請求

(但是不能僅僅根據服務器返回的文件頭里是否包含Access-Control-Allow-origin來判斷其是否允許跨域,因為服務器端配置多域名跨域的時候,也會出現不能跨域的域名返回包里沒有Access-Control-Allow-origin字段的情況。下文配置說明里會講。)

 

配置服務器實現跨域傳輸

前面講到了同源策略的基本判定,以及瀏覽器實現跨域判斷的方式,那么,如何在服務器端做配置來允許跨域傳輸呢?下文將以Nginx為例,講一下三種情況下的配置。

 

配置項解析

CORS常用的配置項有以下幾個

      Access-Control-Allow-Origin(必含) – 允許的域名,只能填通配符或者單域名

  • Access-Control-Allow-Methods(必含) – 這允許跨域請求的http方法(常見有POSTGETOPTIONS

  • Access-Control-Allow-Headers(當預請求中包含Access-Control-Request-Headers時必須包含) – 這是對預請求當中Access-Control-Request-Headers的回復,和上面一樣是以逗號分隔的列表,可以返回所有支持的頭部。

  • Access-Control-Allow-Credentials(可選) – 該項標志着請求當中是否包含cookies信息,只有一個可選值:true(必為小寫)。如果不包含cookies,請略去該項,而不是填寫false。這一項與XmlHttpRequest2對象當中的withCredentials屬性應保持一致,即withCredentials為true時該項也為true;withCredentials為false時,省略該項不寫。反之則導致請求失敗。

  • Access-Control-Max-Age(可選) – 以秒為單位的緩存時間。預請求的的發送並非免費午餐,允許時應當盡可能緩存。

 

具體配置舉例

全域名或者單域名允許跨域

添加的域名必須帶http://協議頭(否則服務器無法區分是http還是https),

如果接受所有域名的跨域請求,則可以用 (安全性有問題,不推薦)

 

  • 'Access-Control-Allow-Methods' 允許多參數,'Access-Control-Allow-origin'不允許多參數,所以只能是條件語句判斷要不要加這個。這也是我前面提到的為什么即使HTTP文件頭返回值里沒有'Access-Control-Allow-origin',也不能說明它就是不允許跨域的。

  • nginx配置文件的http配置部分不能用if條件語句,所以多域名的時候必須加在local部分內。另外加在local內的只對對應的服務器域名做跨域請求的配置,加在http里會讓跑在該nginx下的所有網站都統一采取這種配置。

  • Access-Control-Allow-Origin也可以改成全小寫的形式,不影響結果.(access-control-allow-origin也可以)

 

本文引自:https://blog.csdn.net/evilstar2015/article/details/52459075

 

跨域相關問題解決

https://www.cnblogs.com/ggll611928/p/14212176.html


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM