OSS跨域資源共享(CORS)錯誤及排除

鳴鏑發表於2016-08-29

介紹

跨域資源共享(Cross-Origin Resource Sharing, CORS),介紹及配置請參看 跨域資源共享使用指南

配置項

CORS配置有以下幾項:

  • 來源(AllowedOrigin):允許跨域請求的來源,可以同時指定多個。配置時需帶上完整的域資訊,例如http://10.100.100.100:8001https://www.aliyun.com。注意, 不要遺漏了協議名http或https ,如果埠不是預設的80,還需要帶上埠。如果不能確定的域名,可以開啟瀏覽器的除錯功能,檢視header中的Origin。域名支援萬用字元*,每個域名中允許最多使用一個*,例如https://*.aliyun.com。如果來源指定為*,則表示允許所有來源的跨域請求。
  • Method:按照需求開通對應的方法即可,除錯時可以全部選擇。
  • Allow Header:允許的跨域請求header。允許配置多條匹配規則,以回車間隔。在Access-Control-Request-Headers中指定的每個header,都必須在Allowed Header中有對應項。Header容易遺漏,沒有特殊需求的情況下,建議設定為*,表示允許所有。大小寫不敏感。
  • Expose Header:暴露給瀏覽器的header列表,即使用者從應用程式中訪問的響應頭(例如一個Javascript的XMLHttpRequest物件)。不允許使用萬用字元。具體的配置需要根據應用的需求確定,只暴露需要使用的header。如果不需要暴露可以不填。大小寫不敏感。該項是可選配置項。
  • 快取時間(MaxAgeSeconds):瀏覽器對特定資源的預取請求(OPTIONS請求)返回結果的快取時間,單位為秒。如果沒有特殊情況可以稍大一點,比如60秒。該項是可選配置項。

CORS的配置方法一般是針對每個訪問來源單獨配置規則,不將多個來源混到一個規則,多個規則之間不要有覆蓋衝突。其它的選項只開放需要的許可權即可。

錯誤排除

報錯

CORS配置錯誤會報如下錯誤:

  • 瀏覽器報類似如下錯誤:
OPTIONS http://bucket.oss-cn-beijing.aliyuncs.com/
XMLHttpRequest cannot load http://bucket.oss-cn-beijing.aliyuncs.com/. Response to preflight request doesn`t pass access control check: No `Access-Control-Allow-Origin` header is present on the requested resource. Origin `{yourwebsiet}` is therefore not allowed access. The response had HTTP status code 403.
  • OSS報如下錯誤:
<Code>AccessForbidden</Code>
<Message>CORSResponse: This CORS request is not allowed. This is usually because the evalution of Origin, request method / Access-Control-Request-Method or Access-Control-Requet-Headers are not whitelisted by the resource`s CORS spec.</Message>

提示:

  • CORS報錯一般是站點類應用導致,瀏覽器中可以檢視請求詳情。如Chrome,按 F12 開啟 開發者工具 ,在 Network 中檢視相應元素;
  • OSS返回的錯誤可以通過抓包獲取。如使用Wireshark,篩選器可以指定為 host bucket-name.oss-cn-beijing.aliyuncs.com
  • OSS返回的錯誤也可以通過CORS的除錯程式 oss-h5-upload-js-direct 介面提示獲取。

其它錯誤請參看 常見錯誤及排除

排錯

CORS可能錯誤如下:

  • 來源(AllowedOrigin)配置不正確;
  • Method(AllowedMethod)配置錯誤;
  • Allow Header配置錯誤;
  • Expose Header配置錯誤。

除錯方法:

  • 來源(AllowedOrigin)設定成*,確認該配置項無誤。如果成*後可以成功上傳,說明是來源(AllowedOrigin)配置錯誤,請根據規則認真檢查;
  • Method(AllowedMethod) 全部選擇(GET、PUT、DELETE、POST、HEAD) ,確認該配置專案無誤;
  • Allow Header配置成*,確認該配置無誤;
  • Expose Header設定為指定值或者不填,確認該項配置無誤。

提示:

  • 在控制檯的物件儲存OSS -> Bucket -> Bucket屬性 -> 跨域設定 配置上述選項。


相關文章