瀏覽器的跨域請求 與 CORS 跨域資源共享

2022-07-12 18:36:09 字數 2742 閱讀 4556

今天在學習.netcore的時候,看到了.netcore規定的中介軟體的使用順序,如下圖:

其中有乙個點不是很明白。cors 是什麼呢? 翻了一些資料,記錄一下學習歷程。

cors(cross-origin resource sharing)是乙個w3c標準,中文翻譯為:跨域資源共享。

(在網上還看到了這樣的一句話,覺得比較合理:為了解決跨域資源共享問題,瀏覽器廠商和標準組織在 http 協議的基礎上,提出了 cors 標準協議。cors 協議由一組 http header 構成,用於標識某個資源是否可以被跨域訪問。)

根據定義可以知道,應該是用在跨域方面的乙個協議。

那什麼是跨域呢?簡單來說,就是不是乙個**,這樣說也是有問題的,比如乙個使用者看到的**,可能載入不同的資訊,用的是不同的站點的。所以,詳細說應該是請求的資訊中,協議,ip,埠號,只要有乙個是不同的,就稱之為跨域。

回到中心問題。那我們了解了什麼是cors,那在開發的過程中,應該怎樣去使用呢?或者說**可以用到這個cors呢?

首先,我們在開發過程中可能會遇到以下問題:

no 『access-control-allow-origin』 header is present on the requested resource.

一般情況下,我們修改 access-control-allow-origin  access-control-allow-headers    access-control-allow-methods  等配置,就可以解決這個問題。

那為什麼這樣修改配置就可以處理這個問題呢? 其實這裡利用的就是cors標準。

在詳細講解之前,我們先了解乙個知識點:瀏覽器一般將請求分為簡單請求和非簡單請求。

只要同時滿足以下兩大條件,就屬於簡單請求。

(1) 請求方法是以下三種方法之一:

(2)http的頭資訊不超出以下幾種字段:

瀏覽器對這兩種請求的處理,是不一樣的。

如果origin指定的網域名稱在許可範圍內,伺服器返回的響應,會多出幾個頭資訊字段。

上面的頭資訊之中,有三個與cors請求相關的字段,都以access-control-開頭。

(1)access-control-allow-origin

該字段是必須的。它的值要麼是請求時origin欄位的值,要麼是乙個*,表示接受任意網域名稱的請求。

(2)access-control-allow-credentials

該欄位可選。它的值是乙個布林值,表示是否允許傳送cookie。預設情況下,cookie不包括在cors請求之中。設為true,即表示伺服器明確許可,cookie可以包含在請求中,一起發給伺服器。這個值也只能設為true,如果伺服器不要瀏覽器傳送cookie,刪除該欄位即可。

(3)access-control-expose-headers

該欄位可選。cors請求時,xmlhttprequest物件的getresponseheader()方法只能拿到6個基本字段:cache-controlcontent-languagecontent-typeexpireslast-modifiedpragma。如果想拿到其他字段,就必須在access-control-expose-headers裡面指定。上面的例子指定,getresponseheader('foobar')可以返回foobar欄位的值。

非簡單請求的cors請求,會在正式通訊之前,增加一次http查詢請求,稱為"預檢"請求(preflight)。

瀏覽器先詢問伺服器,當前網頁所在的網域名稱是否在伺服器的許可名單之中,以及可以使用哪些http動詞和頭資訊字段。只有得到肯定答覆,瀏覽器才會發出正式的xmlhttprequest請求,否則就報錯。

非簡單請求的cors請求,會在正式通訊之前,增加一次http查詢請求,稱為"預檢"請求(preflight)。伺服器收到"預檢"請求以後,檢查了originaccess-control-request-methodaccess-control-request-headers字段以後,確認允許跨源請求,就可以做出回應。

一旦伺服器通過了"預檢"請求,以後每次瀏覽器正常的cors請求,就都跟簡單請求一樣,會有乙個origin頭資訊字段。伺服器的回應,也都會有乙個access-control-allow-origin頭資訊字段。

通過以上的了解,我們基本也就了解了,如何使用cors,以及出現跨域問題的時候,應該如何進行修改了。

CORS跨域請求

瀏覽器的同源策略會導致跨域,這裡同源策略又分為以下兩種 只要協議 網域名稱 埠有任何乙個不同,都被當作是不同的域,之間的請求就是跨域操作。在同源策略下會禁止跨域,實際上跨域請求時,請求會向伺服器發出,伺服器也會進行響應,但是當收到返回的資料時發現跨域所以忽略了返回的內容並報錯。當請求同時滿足下面兩個...

cors跨域請求

前端使用正常的ajax請求,請求url填寫需要跨域訪問的url 服務端在檢視函式中對response設定access control allow origin欄位 例如def service request 告訴瀏覽器發的請求是合法的 response access control allow or...

已攔截跨域請求 瀏覽器 瀏覽器攔截跨域請求處理方法

引用 在瀏覽器請求中,出現跨域訪問資源的問題,我們肯定會遇到。如果跨域請求被阻止,有可能導致css js ajax請求 font字型等資源出現無法正常訪問的問題。接下來,就介紹下解決同源策略不允許讀取遠端資源的問題。解決此類問題,最直接的方法就是,就是給被請求的伺服器,新增http頭響應頭,這裡提供...