跨域資源共享(Cross-Origin Resource Sharing)學習筆記

概念

跨域資源共享(Cross-Origin Resource Sharing)是W3C的Web應用工做組退出的一種機制，這種機制能使得Web應用服務器能支持跨站訪問控制，從而能夠安全地進行跨站數據傳輸。

各瀏覽器支持狀況

CORS須要瀏覽器和服務器同時支持，參考caniuse.com中各瀏覽器對CORS的支持狀況，目前只有Opera Mini和IE10如下不支持。

CORS請求類型

CORS中有三種請求類型，簡單請求、預請求、附帶憑證的請求。

簡單請求

簡單請求有一下特徵：

• 只使用GET、HEAD或者POST請求方法。

• 使用POST向服務器端傳送數據，數據類型(Content-Type)僅限於application/x-www-form-urlencoded、multipart/form-data、text/plain。

• 不使用自定義請求頭。

瀏覽器發出的請求頭中會有一個自定義的請求頭字段Origin，其中包含了請求來源地址，而服務器也有個響應頭Access-Control-Allow-Origin，通常以Access-Control-Allow-Origin:*的形式表示全部站點均可以經過XMLHttpRequest來訪問。而若是以Access-Control-Allow-Origin:http://my.com來表示的話就只有http://my.com才能訪問資源。

預請求

預請求會先發一個options給目的站點，驗證一下是否能夠訪問，以後再發實際請求，符合下面狀況的就會被當作預請求處理

• 使用GET、HEAD或者POST之外的請求方法。

• 使用POST向服務器端傳送數據時，數據類型(Content-Type)爲application/x-www-form-urlencoded、multipart/form-data、text/plain三種之外類型。

• 使用了自定義請求頭。

預請求的狀況中第一次是發送一個options，其中包含了Origin、Access-Control-Request-Method、Access-Control-Request-Headers等信息， Access-Control-Request-Method告訴服務器接下來請求的請求方法類型、Access-Control-Request-Headers告訴服務器實際請求包含一個自定義請求頭，服務器根據這些信息來決定是否接受跨站信息訪問。而接下來服務器對options會有一個響應頭，包含了Access-Control-Allow-Origin、Access-Control-Request-Method、Access-Control-Request-Headers、Access-Control-Max-Age會告知瀏覽器可接受的請求方法類型，服務器容許把汗的自定義請求頭、以及請求對象的驗證有效時間，在有效時間內，瀏覽器處理針對該服務器的跨站請求無需再發送預請求。

附帶憑證的請求

對於跨站請求，瀏覽器通常不會發送憑證信息的，但若是將XMLHttpRequest的withCredentials設爲true的話瀏覽器就會容許發送認證信息，在這種狀況下服務器的響應頭若是不包含Access-Control-Allow-Credentials: true的話，瀏覽器不會把響應結果傳遞給發送請求的腳本程序，以保證信息的安全。還有一點要注意的是給一個帶有withCredentials的請求發送響應的時候，服務器必須指定容許請求的域名,不能使用*.不然響應會失敗.

使用場景

• 數據量大的跨域請求中適合CORS。

• 非GET形式的跨域請求。

參考連接

MDN的HTTP訪問控制(CORS)

阮一峯的跨域資源共享 CORS 詳解

IT筆錄-XMLHttpRequest對象對HTTP請求的訪問控制