如何解決 CloudFront 的「請求的資源上不存在 'Access-Control-Allow-Origin' 標頭」錯誤？

上次更新日期：2022 年 6 月 16 日

注意：如果您在執行 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 政策。

在原始伺服器上設定 CORS 政策之後，請設定 CloudFront 分佈以將原始標頭轉送至原始伺服器。如果您的原始伺服器是 Amazon S3 儲存貯體，則設定分佈，以將以下標頭轉送至 Amazon S3：

• Access-Control-Request-Headers
• Access-Control-Request-Method
• 來源

要將標頭轉送到原始伺服器，CloudFront 具有兩個預先定義的政策，具體取決於您的來源類型：CORS-S3Origin 和 CORS-CustomOrigin。

若要將預先定義的政策新增至您的分佈：

1. 從 CloudFront 主控台開啟您的分佈。
2. 選擇 Behaviors (行為) 標籤。
3. 選擇 Create Behavior (建立行為)。或者，選取現有行為，然後選擇 Edit (編輯)。
4. 在 Cache key and origin requests (快取金鑰與來源請求) 之下，選擇 Cache policy and origin request policy (快取政策與來源請求政策)。 接著對於來源請求政策，從下拉式清單中選擇 CORS-S3Origin 或 CORS-CustomOrigin。如需詳細資訊，請參閱使用受管來源請求政策。
   注意：若要改為建立自己的快取政策，請參閱建立快取政策。
5. 選擇 Create Behavior (建立行為)。 或者，如果您正在編輯現有行為指令，請選擇 Save changes (儲存變更)。

若要使用快取政策轉送標頭：

1. 建立快取政策。
2. 在 Cache key settings (快取金鑰設定)，為 Headers (標頭) 選擇 Include the following headers (包含下列標頭)。從 Add header (新增標頭) 下拉式清單中，選擇您的來源所需的其中一個標題。
3. 根據您要連接政策的行為所需，填入快取政策設定。
4. 將快取政策連接至 CloudFront 分佈的行為。

若要使用舊式快取設定轉送標頭：

1. 從 CloudFront 主控台開啟您的分佈。
2. 選擇 Behaviors (行為) 標籤。
3. 選擇 Create Behavior (建立行為)。或者，選取現有行為，然後選擇 Edit (編輯)。
4. 在 Cache key and origin requests (快取金鑰與來源請求) 之下，選擇 Legacy cache settings (舊式快取設定)。
5. 在 Headers (標頭) 下拉式清單中，選擇您的來源所需的標頭。選擇 Add custom (新增自訂) 以新增下拉式清單中未顯示，但您的來源需要的標頭。
6. 選擇 Create Behavior (建立行為)。或者，如果您正在編輯現有行為指令，請選擇 Save changes (儲存變更)。

注意：請確定也轉送您的用戶端對 CloudFront 所發送請求之部分的標頭，CloudFront 會將該請求轉送至來源。

如果您在更新 CORS 政策及轉送適當的標頭後仍然發現錯誤，請嘗試在您分佈的快取行為中允許 OPTIONS HTTP 方法。根據預設，CloudFront 僅允許使用 GET 和 HEAD 方法。但是，某些 Web 瀏覽器可能會發出 OPTIONS 方法的請求。若要在 CloudFront 分佈上開啟 OPTIONS 方法：

1. 從 CloudFront 主控台開啟您的分佈。
2. 選擇 Behaviors (行為) 標籤。
3. 選擇 Create Behavior (建立行為)。或者，選取現有行為，然後選擇 Edit (編輯)。
4. 對於 Allowed HTTP Methods (允許的 HTTP 方法)，請選擇 GET、HEAD、OPTIONS。
5. 選擇 Create Behavior (建立行為)。或者，如果您正在編輯現有行為指令，請選擇 Save changes (儲存變更)。

如果原始伺服器無法存取或無法設定為傳回適當的 CORS 標頭，請設定 CloudFront 以傳回所需的 CORS 標頭。若要設定，請建立回應標頭政策：

1. 從 CloudFront 主控台開啟您的分佈。
2. 選擇 Behaviors (行為) 標籤。
3. 選擇 Create Behavior (建立行為)。或者，選取現有行為，然後選擇 Edit (編輯)。
4. 對於回應標題政策：
   從下拉式清單中選取現有的回應政策。
   -或-
   選擇建立政策以建立新的回應標頭政策。在新政策中的跨來源資源共享下，開啟 CORS。
5. 視需要填入其他設定，然後選擇建立政策。
6. 在「Create Behavior (建立行為)」頁面中，從下拉式清單中選擇您建立的政策。
7. 選擇 Create Behavior (建立行為)。或者，如果您正在編輯現有行為指令，請選擇 Save changes (儲存變更)。

注意：CloudFront 通常會在五分鐘內將變更部署到分佈。編輯分佈後，請讓快取無效，以清除先前快取的回應。