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

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

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

請求方法說明
head發送頭部信息
get 
post 

簡單請求的HTTP頭信息

http頭信息說明
accept指定客戶端可以接受哪類信息,eg: image/git
accept-language指定客戶端可以接受的自然語言,如果沒有指定,認為各語言都可以。eg:accept-language: zh-cn
content-language描述實體報頭和資源所用的自然語言。沒有設置該規則認為實體內容將提供給所有的語言閱讀
Last-Event-ID最后一次接收到事件的標識符
content-type實體報文和資源的類型,只限于三個值:application/x-www-form-unlencoded、multipart/form-data、text/plain

二、簡單請求處理原理

請求頭說明
Access-Control-Allow-origin指定可以跨域訪問的網站,可以設置為*,表示所有res.setHeader("Access-Control-Allow-origin","//localhost")
Access-Control-Allow-Credentials有這個頭或者值為true,表示可接受跨域的cookies。而withCredentials是客戶端設置是否傳遞cookies到服務器。
Access-Control-Expose-Headers默認cors請求??突Ф說膞mlHttpRequrest只能拿到Cache-Control、Content-Language、Content-Type、Exprise、Last-Modified、Pragma等6個字段,其他頭就需要通過Access-Control-Expose-Headers來指定

注意事項

  1. 码报开奖结果本期 www.iwqgw.icu 設置了Access-Control-Allow-Credentials為true,或者有這個頭,那么Access-Control-Allow-Origin就不能用*。

  2. 發送cookie時,Access-Control-Allow-Origin不能為*,cookie依然同源,只有服務器域名設置的cookie才會上傳的。

  3. 原網頁代碼中的document.cookie也無法讀取服務器域名下的cookie(客戶端),通過xmlHttp.getResponseHeader("set-cookies")也不可以的。

  4. 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的。非簡單請求兩大步驟:

  1. 預驗證“請求”,瀏覽器會發送請求方法為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頭(客戶端),會提示錯誤

來源:itnose

上一篇: 實現簡易版的moment.js

下一篇: 高德地圖和canvas畫圖結合應用的一些感想(一)

分享到: 更多
重庆时时彩v1.2.0版本 双色球历史开奖结果查询器 千里马计划怎么避免连挂 重庆欢乐生肖开奖 幸运飞船免费计划一期7 重庆时时开奖结果记录500 陕西福彩快乐十分稳赚技巧 老时时开奖统计 牛爹七星彩资料精华头 新时时和老时时的区别 新开棋牌游戏平台 七星彩出号规律总结 捕鱼达人4 时时彩龙虎计划网页版 欢乐生肖玩法讲解 刘伯温六肖精选资料