跨域-CORS

kevin 發布于2019-08-20 17:37 / 2595人閱讀

摘要：一概念跨源資源共享訪問控制，后面會看到以前綴的頭部字段。機制讓服務端控制是否準許跨域請求當然了也要承擔確保安全的職責。服務端怎么瀏覽器這樣吧，如果是跨域請求，我先咨詢下你，如果你覺得請求安全，我再把真實請求發給你。

一、概念：

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

二、引入背景：

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

三、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服務接口，需要注意幾點

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

參考：

MDN：

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

W3C：

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

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/83733.html

第二十五章：SpringBoot添加支持CORS跨域訪問

摘要：本章目標基于項目搭建可以站外請求訪問的跨域資源服務器。允許所有的請求域名訪問我們的跨域資源，可以固定單條或者多條內容，如，只有百度可以訪問我們的跨域資源。 CORS（Cross-Origin Resource Sharing）跨域資源共享，是一個W3C標準，它允許瀏覽器向跨域服務器發送Ajax請求，打破了Ajax只能訪問本站內的資源限制，CORS在很多地方都有被使用，微信支付的JS支付...

simpleapples 2019-08-15 12:01 評論0 收藏0
「新輪子」PHP CORS (Cross-origin resource sharing)，解決 P

摘要：而我的新輪子也并不是專門解決它的問題的，而是順便解決而已。概述這個包，支持在所有的項目中使用。一旦出現成員，代表允許全部。列出允許跨域請求的方法列表，默認是代表所有方法。信息地址嗯，新輪子，求一波。 showImg(https://segmentfault.com/img/bV5VxN?w=844&h=656); 是的，可能了解 Laravel 的都知道，在 Laravel 中簡單的設...

lbool 2019-06-28 18:34 評論0 收藏0
【日常填坑】之ajax請求laravel的api接口

摘要：合適和夠用是最完美的追求。比如從頁面去請求的資源。它允許瀏覽器向跨源服務器，發出請求，從而克服了只能同源使用的限制。定義在中的路由都是無狀態的，并且會應用中間件組。關于作者程序開發人員，不拘泥于語言與技術，目前主要從事PHP和前端開發，使用Laravel和VueJs，App端使用Apicloud混合式開發。合適和夠用是最完美的追求。個人網站：http://www.linganm...

Arno 2019-06-27 15:31 評論0 收藏0
【日常填坑】之ajax請求laravel的api接口

摘要：合適和夠用是最完美的追求。比如從頁面去請求的資源。它允許瀏覽器向跨源服務器，發出請求，從而克服了只能同源使用的限制。定義在中的路由都是無狀態的，并且會應用中間件組。關于作者程序開發人員，不拘泥于語言與技術，目前主要從事PHP和前端開發，使用Laravel和VueJs，App端使用Apicloud混合式開發。合適和夠用是最完美的追求。個人網站：http://www.linganm...

neu 2019-08-20 14:28 評論0 收藏0
【日常填坑】之ajax請求laravel的api接口

摘要：合適和夠用是最完美的追求。比如從頁面去請求的資源。它允許瀏覽器向跨源服務器，發出請求，從而克服了只能同源使用的限制。定義在中的路由都是無狀態的，并且會應用中間件組。關于作者程序開發人員，不拘泥于語言與技術，目前主要從事PHP和前端開發，使用Laravel和VueJs，App端使用Apicloud混合式開發。合適和夠用是最完美的追求。個人網站：http://www.linganm...

fuyi501 2019-08-01 16:20 評論0 收藏0