CDN:オリジン間リソース共有 (CORS) の設定

オリジン間リソース共有とは

オリジン間リソース共有 (CORS) は、ウェブページが自身のオリジン (ドメイン、プロトコル、またはポート) とは異なるオリジンからリソースにアクセスできるようにする標準的なメカニズムです。これにより、オリジン間のデータ転送を安全に行うことができます。詳細については、「オリジン間リソース共有 (CORS)」をご参照ください。

オリジン間リソース共有を設定する理由

セキュリティ上の制約により、ブラウザーは通常、同一オリジンポリシーに従います。これにより、異なるドメイン、サブドメイン、プロトコル、またはポートからのリソースの読み込みやアクセスが制限されます。たとえば、example.com は example.org 上のリソースにアクセスできません。オリジン間リソース共有 (CORS) を設定することで、CDN/ サーバーに関連するレスポンスヘッダーを設定できます。リクエストに許可されたルールを満たすヘッダーが含まれている場合、サーバーは対応する HTTP レスポンスヘッダーを返し、オリジン間のリソースの読み込みとアクセスを許可します。

仕組み

オリジンサーバーでの CORS 設定

CDN での CORS 設定

注意事項

• OSS バケットをオリジンサーバーとして使用する場合、CDN/ コンソールの CORS 設定が OSS コンソールの CORS 設定を上書きします。OSS コンソールで CORS を設定する方法の詳細については、「CORS ルールの設定」をご参照ください。

• オンプレミスサーバーまたは ECS インスタンスをオリジンサーバーとして使用する場合、静的コンテンツと動的コンテンツを分離し、CDN/ を使用して静的ファイルの配信を高速化することを推奨します。CDN/ コンソールで設定された CORS 機能は、静的ファイルにのみ適用されます。

オリジン間リソース共有の有効化

1. Alibaba Cloud CDN コンソールにログインします。

2. 左側のナビゲーションペインで [ドメイン名 ] をクリックします。

3. ドメインページで、管理するドメインを見つけ、管理 列の 操作 をクリックします。

4. キャッシュ設定 をクリックし、送信レスポンスヘッダーの変更 タブを選択して、クロスオリジンリクエストに許可されるオリジンとメソッドを設定します。

   • オリジン間リクエストのオリジンの設定

     追加 をクリックし、次の表の説明に従ってパラメーターを設定してから、OK をクリックします。

     パラメーター	説明	例
     [実行内容]	CORS 検証機能を有効にするには、このパラメーターを 追加 に設定します。	[追加]
     [応答ヘッダー]	CORS 検証機能を使用するには、Access-Control-Allow-Origin を設定する必要があります。	Access-Control-Allow-Origin
     [応答ヘッダー値]	CORS 検証が無効の場合：ワイルドカードまたは単一のオリジンのみを指定できます。 ワイルドカード *：任意のオリジンからのリソースへのアクセスを許可します。 単一のオリジン：特定の一つのオリジン (ドメイン名) からのみリソースへのアクセスを許可します。 CORS 検証が有効の場合：ワイルドカード、単一のオリジン、複数のオリジン、またはワイルドカードドメインを指定できます。 ワイルドカード *：任意のオリジンからのリソースへのアクセスを許可します。 単一のオリジン：特定の一つのオリジン (ドメイン名) からのみリソースへのアクセスを許可します。 指定した複数のオリジン：複数の特定のオリジン (ドメイン名) をコンマ , で区切って設定し、これらのオリジンからのリソースへのアクセスを許可します。 ワイルドカードドメイン：ワイルドカードドメインを指定して、パターンに一致するすべてのオリジンからのアクセスを許可します。	* http://www.aliyun.com https://aliyun.com,http://www.aliyun.com http://*.aliyun.com
     [重複の許可]	はい：オリジンサーバーからのヘッダーは保持され、新しく追加された同名のヘッダーもレスポンスに追加されます。 いいえ：新しく追加されたヘッダーが、オリジンサーバーからの同名のヘッダーを上書きします。 重要 [重複を許可] と [CORS 検証] の設定は相互に排他的です。[重複を許可] を [はい] に設定すると、CORS 検証は無効になります。	[いいえ]
     [CORS]	CORS は、実行内容 が 追加 に設定され、かつ 応答ヘッダー が "Access-Control-Allow-Origin" に設定されている場合にのみ設定できます。 CORS は しない または 有効 に設定できます。デフォルト値は しない です。 [しない]：CDN の POP (ポイントオブプレゼンス) は受信リクエストの Origin ヘッダーを検証せず、常に設定された Access-Control-Allow-Origin の値を返します。 [有効]：CDN の POP は、以下のルールに基づいてオリジン間リクエストを検証し、それに応じて Access-Control-Allow-Origin の値を返します。 [応答ヘッダー]：[ヘッダー値] が * に設定されている場合、ユーザーリクエストの Origin ヘッダーの有無やその値に関わらず、POP は常に Access-Control-Allow-Origin:* を返します。 [応答ヘッダー]：[ヘッダー値] に、コンマ (,) で区切られた 1 つ以上の特定のオリジンが設定されている場合： ユーザーリクエストの Origin ヘッダーの値が、設定されたオリジンのいずれかと完全に一致する場合、POP はそのオリジンを Access-Control-Allow-Origin ヘッダーの値として返します。 一致するものが見つからない場合、POP は CORS ヘッダーをレスポンスに追加しません。 [応答ヘッダー]：[ヘッダー値] がワイルドカードドメインに設定されている場合、POP はリクエストの Origin ヘッダーがワイルドカードパターンに一致するかどうかをチェックします。 有効 を 応答ヘッダー値 に設定し、応答ヘッダー値 フィールドのドメイン名にハイフン (-) が含まれている場合は、- を %- に置き換えてエスケープする必要があります。 例: 元のヘッダー値：http://doc.aliyun-example.com。 エスケープされたヘッダー値：http://doc.aliyun%-example.com。	[有効化]

   • オリジン間リクエストのメソッドの設定

     追加 をクリックし、次の表に従ってパラメーターを設定してから、OK をクリックします。

     パラメーター	説明	例
     [実行内容]	このパラメーターを追加に設定します。	[追加]
     [応答ヘッダー]	Access-Control-Allow-Methods に設定する必要があります	Access-Control-Allow-Methods
     [応答ヘッダー値]	GET, POST, PUT リクエストメソッドをサポートしています。同時に GET, POST, PUT を追加する必要がある場合は、コンマ , で区切ります。	GET
     [重複の許可]	はい：オリジンサーバーからのヘッダーは保持され、新しく追加された同名のヘッダーもレスポンスに追加されます。 いいえ：新しく追加されたヘッダーが、オリジンサーバーからの同名のヘッダーを上書きします。	[いいえ]

設定例

よくある質問

Access-Control-Allow-Origin レスポンスヘッダーを設定した後もオリジン間エラーが発生し、レスポンスにヘッダーが含まれていないのはなぜですか。