跨來源資源分享 (CORS) - AWS SDK for JavaScript
CORS 的運作方式是否需要設定 CORS設定 Amazon S3 儲存貯體的 CORSCORS 組態範例

AWS SDK for JavaScript v2 已end-of-support。我們建議您遷移至 AWS SDK for JavaScript v3。如需如何遷移的其他詳細資訊和資訊，請參閱此公告。

本文為英文版的機器翻譯版本，如內容有任何歧義或不一致之處，概以英文版為準。

跨來源資源分享 (CORS)

跨來源資源分享 (CORS) 是現代 Web 瀏覽器的一項安全功能，其可讓 Web 瀏覽器協調能請求外部網站或服務的網域。由於系統會將大多數資源請求傳送至外部網域 (如 Web 服務的端點)，當您使用 AWS SDK for JavaScript 開發瀏覽器應用程式時，CORS 是項重要的考量條件。如果 JavaScript 環境會強制執行 CORS 安全性，您就必須使用服務設定 CORS。

CORS 會根據以下要素判斷是否允許在跨來源請求中共享資源：

  • 提出請求的特定網域

  • 提出的 HTTP 請求類型 (GET、PUT、POST、DELETE 等)

CORS 的運作方式

在最簡單的案例中，瀏覽器指令碼會從另一個網域中的伺服器發出資源 GET 請求。依據該伺服器的 CORS 組態而定，如果請求是來自有權提交 GET 請求的網域，則跨來源伺服器會透過傳回請求的資源來予以回應。

若發出請求的網域或 HTTP 請求類型皆未經授權，該請求即會遭拒。然而，CORS 能夠在實際提交請求前進行預檢。此案例中，會發出預檢請求，此請求中會一併傳送 OPTIONS 存取請求操作。如果跨來源伺服器的 CORS 組態將存取權限授予給提出請求的網域，伺服器就會傳回預檢回應，其中列出提出請求的網域能對請求資源所進行的 HTTP 請求類型。

CORS 請求的處理流程

是否需要設定 CORS

Amazon S3 儲存貯體需要 CORS 組態，才能對其執行操作。某些 JavaScript 環境可能不會強制執行 CORS，所以不需要設定 CORS。例如，如果您從 Amazon S3 儲存貯體託管應用程式，並從 *.s3.amazonaws.com或其他一些特定端點存取資源，您的請求將不會存取外部網域。因此，這個組態就不需要 CORS。在此情況下，CORS 仍會用於 Amazon S3 以外的服務。

設定 Amazon S3 儲存貯體的 CORS

您可以在 Amazon S3 主控台中設定 Amazon S3 儲存貯體以使用 CORS。

  1. 在 Amazon S3 主控台中，選擇您要編輯的儲存貯體。

  2. 選取許可索引標籤，然後向下捲動至跨來源資源共用 (CORS) 面板。

    Amazon S3 中的 CORS 組態編輯器，用於設定儲存貯體的 CORS 組態

  3. 選擇編輯，然後在 CORS 組態編輯器中輸入 CORS 組態，然後選擇儲存。

CORS 組態是一種 XML 檔案，包含 <CORSRule> 內的一系列規則。一個組態最多可以擁有 100 條規則，而規則是由下列其中一個標籤所定義：

  • <AllowedOrigin> 會指定允許提出跨網域請求的網域來源。

  • <AllowedMethod> 會指定跨網域請求中允許的請求類型 (GET、PUT、POST、DELETE、HEAD)。

  • <AllowedHeader> 會指定預檢請求中允許使用的標頭。

如需範例組態，請參閱《Amazon Simple Storage Service 使用者指南》中的如何在儲存貯體上設定 CORS？。

CORS 組態範例

以下 CORS 組態範例允許使用者從網域 example.org 檢視、新增、移除或更新儲存貯體內的物件，但仍建議您將 <AllowedOrigin> 範圍限定在網站的網域。若要允許任何來源，則可指定 "*"。

重要

在新的 S3 主控台中，CORS 組態必須為 JSON 格式。

XML
<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
  <CORSRule>
    <AllowedOrigin>https://example.org</AllowedOrigin>
    <AllowedMethod>HEAD</AllowedMethod>
    <AllowedMethod>GET</AllowedMethod>
    <AllowedMethod>PUT</AllowedMethod>
    <AllowedMethod>POST</AllowedMethod>
    <AllowedMethod>DELETE</AllowedMethod>
    <AllowedHeader>*</AllowedHeader>
    <ExposeHeader>ETag</ExposeHeader>
    <ExposeHeader>x-amz-meta-custom-header</ExposeHeader>
  </CORSRule>
</CORSConfiguration>
JSON
[
    {
        "AllowedHeaders": [
            "*"
        ],
        "AllowedMethods": [
            "HEAD",
            "GET",
            "PUT",
            "POST",
            "DELETE"
        ],
        "AllowedOrigins": [
            "https://www.example.org"
        ],
        "ExposeHeaders": [
             "ETag",
             "x-amz-meta-custom-header"]
    }
]

這個組態並不會授權使用者對儲存貯體執行任何動作，它可讓瀏覽器的安全模型允許對 Amazon S3 提出請求。必須透過儲存貯體許可或 IAM 角色許可來設定許可。

您可以使用 ExposeHeader 讓 SDK 讀取從 Amazon S3 傳回的回應標頭。舉例而言，如果您想讀取來自 PUT 或分段上傳的 ETag 標頭，就需要在組態中加入 ExposeHeader 標籤，如上述範例所示。軟體開發套件僅能存取透過 CORS 組態公開的標頭。若您在物件上設定中繼資料，則傳回的值即為具有字首 x-amz-meta- 的標頭 (如 x-amz-meta-my-custom-header)；請務必以相同方式公開該標頭。