首頁 >web前端 >js教程 >跨域場景下CORS何時使用預檢請求?

跨域場景下CORS何時使用預檢請求?

DDD
DDD原創
2024-10-18 21:48:30525瀏覽

When Does CORS Use a Preflight Request in Cross-Domain Scenarios?

CORS:了解跨域請求的「預檢」請求

跨來源資源共享(CORS) 在製作HTTP 時帶來了挑戰跨域請求。為了解決這些限制,引入了預檢請求作為解決方法。

預檢請求解釋

預檢請求是先於實際請求(例如 GET 或 POST)的 OPTIONS 請求)並用於與伺服器協商請求的權限。這些請求包含兩個附加標頭:

  • Access-Control-Request-Method: 指定實際請求的方法。
  • Access-Control -Request-Headers: 列出將包含在實際請求中的標頭。

設定伺服器回應

要處理預檢請求,伺服器必須使用下列標頭回應:

  • Access-Control-Allow-Origin: 向請求中指定的來源授予權限。
  • Access-Control-Allow-Methods: 指定實際請求允許的方法。
  • Access-Control-Allow-Headers: 列出允許瀏覽器存取的標頭發送實際請求。

客戶端預檢實施

為了使預檢請求成功,客戶端必須包含以下修改:

  • 發送OPTIONS 請求:在實際請求之前,發送帶有適當Access-Control-Request-* 標頭的OPTIONS 請求。
  • 包含必要的內容headers: 確保實際請求包含 Access-Control-Allow-Headers 回應標頭中指定的所有標頭。

範例:

考慮 POST 請求的預檢請求,以從遠端 URL 取得資料。

預檢請求:

  • 來源:https://yourdomain.com
  • 存取控制請求方法:POST
  • 存取控制請求標頭:X-自訂標頭

伺服器回應(假設POST和X-Custom-Header 是允許的):

  • Access-Control-Allow-Origin:https://yourdomain.com
  • Access-Control-Allow-Methods :POST
  • 存取控制允許標頭:X-自訂標頭

實際要求:

  • 來源: https://yourdomain.com
  • 方法:POST
  • X-Custom-Header: value

透過執行下列步驟,您可以有效地預檢HTTP 請求使用CORS 克服跨域限制。

以上是跨域場景下CORS何時使用預檢請求?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn