首頁 > web前端 > js教程 > CORS(跨域)請求總結和測試

CORS(跨域)請求總結和測試

巴扎黑
發布: 2017-06-23 10:50:57
原創
3145 人瀏覽過

一、簡單請求與非簡單請求

跨域請求分為簡單與非簡單請求,同時滿足以下兩種條件的可以確定為簡單請求。 簡單請求的請求方法

請求方法 說明
head #發送頭部資訊
get  
#post  

http頭資訊說明accept指定客戶端可以接受哪一類訊息,eg: image/git
#簡單請求的HTTP頭資訊

#accept-language

指定客戶端可以接受的自然語言,如果沒有指定,認為各語言都可以。 eg:accept-language: zh-cncontent-language描述實體標頭和資源所使用的自然語言。沒有設定該規則認為實體內容將提供給所有的語言閱讀Last-Event-IDcontent-type實體封包和資源的類型,只限於三個值:application/x-www-form-unlencoded、multipart/form-data、text/plain#請求頭
最後一次接收到事件的標識符
二、簡單請求處理原理

說明

  1. #Access-Control-Allow-origin

  2. 指定可以跨網域存取的網站,可以設定為*,表示所有
  3. res.setHeader("Access-Control-Allow-origin" ,"http://localhost")

  4. Access-Control-Allow-Credentials

  5. 有這個頭或值為true,表示可接受跨域的cookies。而withCredentials是客戶端設定是否要傳遞cookies到伺服器。
  6. Access-Control-Expose-Headers
預設cors請求。客戶端的xmlHttpRequrest只能拿到Cache-Control、Content-Language、Content-Type、Exprise、Last-Modified、Pragma等6個字段,其他頭就需要透過Access-Control-Expose-Headers指定

注意事項

    設定了Access-Control-Allow-Credentials為true,或是有這個頭,那麼Access-Control-Allow-Origin就不能用*。
  1. 發送cookie時,Access-Control-Allow-Origin不能為*,cookie仍然同源,只有伺服器網域設定的cookie才會上傳的。
原網頁程式碼中的document.cookie也無法讀取伺服器網域下的cookie(客戶端),透過xmlHttp.getResponseHeader("set-cookies")也不可以的。 xmlHttp可以取得到foo、boo物件#
res.setHeader("Access-Control-Allow-origin","*"); 
res.setHeader("Access-Control-Expose-Headers", "foo,boo"),
res.setHeader("foo", "foo");
res.setHeader("boo", "boo");
登入後複製
三、非簡單的請求處理原理 如果請求方法是PUT、DELETE,或是Content-type的類型為applicetion/json。非簡單請求兩大步驟:
預先驗證“請求”,瀏覽器會發送請求方法為options的請求,然後會帶上如下三個頭
###頭名######說明#############Origin######表示已傳送請求傳送的來源域名############Access-Control-Request-Method######需要跨網域執行的請求方法(也可以叫動作)############ Access-Control-Request-Headers######指定cors請求會額外傳送的頭部訊息,給予客戶端自訂頭部的機會############
  1. 服務判斷是否指定了Access-Control-Allow-Origin頭,且值是可匹配的,驗證通過則輸出資訊如下頭部內容:

頭名 說明
#Access-Control-Allow-Methods 表示伺服器支援的cors請求方法,多個用逗號隔開
Access-Control-Allow-Headers 如果請求有了Access-Control-Request-Headers頭,必須傳回此頭,表示伺服器支援的所有頭部訊息,多個以逗號隔開
Access-Control-Allow-Credentials 與簡單請求一致
Access-Control-Max-Age 指定本次預先驗證的有效期,單位:秒

注意:

  1. Access-Control-Request-Headers和Access-Control-Request-Method不需要開發者來設置,這是瀏覽器自動識別的.Access-Control-Request-Headers根據請求的自訂頭生成,而Access-Control-Request-Method根據請求的方法生成。

  2. headers設定不對的表現:

3. 正確的設定:

四、跨域cookie的處理(不行)

  1. #跨域是設定不了cookie的。服務端輸出的cookie無效

  2. ajax取得set-Cookies頭(客戶端),會提示錯誤

##

以上是CORS(跨域)請求總結和測試的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板