如何解決 CloudFront 的「請求的資源上不存在 'Access-Control-Allow-Origin' 標頭」錯誤?
上次更新日期:2022 年 6 月 16 日
我收到針對 Amazon CloudFront 中所請求資源的 CORS 錯誤「不存在 'Access-Control-Allow-Origin'」。為什麼會收到此無誤,我該如何解決它?
解析度
確認來源的跨來源資源共享 (CORS) 政策允許來源傳回 Access-Control-Allow-Origin 標頭
注意:如果您在執行 AWS Command Line Interface (AWS CLI) 命令時收到錯誤,請確保您使用的是最新的 AWS CLI 版本。
執行以下命令以確認原始伺服器返回 Access-Control-Allow-Origin 標頭。將 example.com 取代為所需的來源標頭。將 https://www.example.net/video/call/System.generateId.dwr 取代為返回標頭錯誤的資源的 URL。
curl -H "Origin: example.com" -v "https://www.example.net/video/call/System.generateId.dwr"
如果 CORS 政策允許原始伺服器傳回 Access-Control-Allow-Origin 標頭,您會看到類似下列的回應:
HTTP/1.1 200 OK
Server: nginx/1.10.2
Date: Mon, 01 May 2018 03:06:41 GMT
Content-Type: text/html
Content-Length: 3770
Last-Modified: Thu, 16 Mar 2017 01:50:52 GMT
Connection: keep-alive
ETag: "58c9ef7c-eba"
Access-Control-Allow-Origin:
example.com
Accept-Ranges: bytes
如果在回應中未傳回 CORS 標頭,則沒有為 CORS 正確設定原始伺服器。在您的自訂來源或 Amazon Simple Storage Service (Amazon S3) 來源上設定 CORS 政策。
將 CloudFront 分佈設定為將適當的標頭轉送至原始伺服器
在原始伺服器上設定 CORS 政策之後,請設定 CloudFront 分佈以將原始標頭轉送至原始伺服器。如果您的原始伺服器是 Amazon S3 儲存貯體,則設定分佈,以將以下標頭轉送至 Amazon S3:
- Access-Control-Request-Headers
- Access-Control-Request-Method
- 來源
要將標頭轉送到原始伺服器,CloudFront 具有兩個預先定義的政策,具體取決於您的來源類型:CORS-S3Origin 和 CORS-CustomOrigin。
若要將預先定義的政策新增至您的分佈:
- 從 CloudFront 主控台開啟您的分佈。
- 選擇 Behaviors (行為) 標籤。
- 選擇 Create Behavior (建立行為)。或者,選取現有行為,然後選擇 Edit (編輯)。
- 在 Cache key and origin requests (快取金鑰與來源請求) 之下,選擇 Cache policy and origin request policy (快取政策與來源請求政策)。 接著對於來源請求政策,從下拉式清單中選擇 CORS-S3Origin 或 CORS-CustomOrigin。如需詳細資訊,請參閱使用受管來源請求政策。
注意:若要改為建立自己的快取政策,請參閱建立快取政策。 - 選擇 Create Behavior (建立行為)。 或者,如果您正在編輯現有行為指令,請選擇 Save changes (儲存變更)。
若要使用快取政策轉送標頭:
- 建立快取政策。
- 在 Cache key settings (快取金鑰設定),為 Headers (標頭) 選擇 Include the following headers (包含下列標頭)。從 Add header (新增標頭) 下拉式清單中,選擇您的來源所需的其中一個標題。
- 根據您要連接政策的行為所需,填入快取政策設定。
- 將快取政策連接至 CloudFront 分佈的行為。
若要使用舊式快取設定轉送標頭:
- 從 CloudFront 主控台開啟您的分佈。
- 選擇 Behaviors (行為) 標籤。
- 選擇 Create Behavior (建立行為)。或者,選取現有行為,然後選擇 Edit (編輯)。
- 在 Cache key and origin requests (快取金鑰與來源請求) 之下,選擇 Legacy cache settings (舊式快取設定)。
- 在 Headers (標頭) 下拉式清單中,選擇您的來源所需的標頭。選擇 Add custom (新增自訂) 以新增下拉式清單中未顯示,但您的來源需要的標頭。
- 選擇 Create Behavior (建立行為)。或者,如果您正在編輯現有行為指令,請選擇 Save changes (儲存變更)。
設定 CloudFront 分佈的快取行為以允許 HTTP 請求的 OPTIONS 方法
- 從 CloudFront 主控台開啟您的分佈。
- 選擇 Behaviors (行為) 標籤。
- 選擇 Create Behavior (建立行為)。或者,選取現有行為,然後選擇 Edit (編輯)。
- 對於 Allowed HTTP Methods (允許的 HTTP 方法),請選擇 GET、HEAD、OPTIONS。
- 選擇 Create Behavior (建立行為)。或者,如果您正在編輯現有行為指令,請選擇 Save changes (儲存變更)。
設定 CloudFront 回應政策以傳回所需的 Access-Control-Allow-Origin 標頭
如果原始伺服器無法存取或無法設定為傳回適當的 CORS 標頭,請設定 CloudFront 以傳回所需的 CORS 標頭。若要設定,請建立回應標頭政策:
- 從 CloudFront 主控台開啟您的分佈。
- 選擇 Behaviors (行為) 標籤。
- 選擇 Create Behavior (建立行為)。或者,選取現有行為,然後選擇 Edit (編輯)。
- 對於回應標題政策:
從下拉式清單中選取現有的回應政策。
-或-
選擇建立政策以建立新的回應標頭政策。在新政策中的跨來源資源共享下,開啟 CORS。 - 視需要填入其他設定,然後選擇建立政策。
- 在「Create Behavior (建立行為)」頁面中,從下拉式清單中選擇您建立的政策。
- 選擇 Create Behavior (建立行為)。或者,如果您正在編輯現有行為指令,請選擇 Save changes (儲存變更)。
注意:CloudFront 通常會在五分鐘內將變更部署到分佈。編輯分佈後,請讓快取無效,以清除先前快取的回應。