跨域-CORS

1、概念：

跨源資源共享：（Cross-Origin Resource Sharing）
訪問控制：Access Control，後面會看到以Access-Control前綴的頭部字段。

2、引入背景：

JS中的xhr請求（XMLHttpRequest）受同源策略限制。可是這也致使有些合理的請求也被限制了。W3C提出了新的標準CORS來解決這個問題。CORS機制讓服務端控制是否准許跨域請求（固然了也要承擔確保安全的職責）。教程參考MDN（即MDN的參考），下面作些總結性的筆記。

3、CORS原理

3.1 瀏覽器和服務端的談判

服務端：hi，我說你管的也太多了！我認爲request A是安全的，你怎麼不發給我？
瀏覽器：我怎麼知道request A是安全。爲了安全起見，我不能發給你。
服務端：瞎子都能看出來reques是安全的。你個SB。
瀏覽器：你才SB
服務端：你SB
......
瀏覽器：咱每天這樣吵也不是事啊。我們各退一步。
服務端：怎麼？
瀏覽器：這樣吧，若是是跨域請求，我先諮詢下你，若是你以爲請求安全，我再把真實請求發給你。（Origin, Access-Control-Allow-Origin）
服務器：恩，好吧。不過你每次都先諮詢我，對性能會形成影響啊，再說了有些請求不存在安全問題。
瀏覽器：也是啊。這樣吧，對於那些安全的請求，我直接發給你。簡單請求的定義你看看
服務器：這個定義確實OK，但也太苛刻了，實際應用中不多遇到啊，這樣對性能的提高沒有實際解決。
瀏覽器：可是確保安全是我底線。這個沒得讓步。
服務器：要不這樣，你把預檢的結果緩存一段時間，在緩存時間內不用再發送預檢請求。
瀏覽器：好想法，就這樣幹。不過你得告訴我緩存多久。
服務器：能夠啊。（Access-Control-Max-Age）

3.2 CORS流程圖

3.3CORS-服務端

要實現CORS機制離不開服務端的配合。爲了更好的實現支持CORS服務接口，須要注意幾點

1. request可能會請求服務兩次(預檢，真實請求),在處理預檢過程當中不要作真實請求的邏輯處理。

參考：

MDN：

https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS

W3C：

https://www.w3.org/TR/cors/