API Gateway:オリジン間リソース共有ポリシーを設定する

オリジン間リソース共有ポリシーを設定する

1. クラウドネイティブ API Gateway では、インスタンスの外部とインスタンスの内部の 2 つの方法で CORS ポリシーを設定できます。

   インスタンス外の API

   1. クラウドネイティブ API Gateway コンソールにログインします。左側のナビゲーションウィンドウで、[API] を選択し、上部のメニューバーでリージョンを選択します。

   2. ターゲット API をクリックします。ドロップダウンリストから CORS ポリシーを設定するインスタンスを選択するか、[すべてのインスタンス] を選択できます。

   3. [ルートリスト] からターゲットルートを選択します。

   インスタンス内の API

   1. クラウドネイティブ API Gateway コンソールにログインします。左側のナビゲーションウィンドウで、[インスタンス] を選択し、上部のメニューバーでリージョンを選択します。

   2. [インスタンス] ページで、ターゲットゲートウェイインスタンスの ID をクリックします。左側のナビゲーションウィンドウで、[API] を選択し、ターゲット API をクリックします。

   3. [ルートリスト] からターゲットルートを選択します。

2. [ポリシー設定] タブをクリックし、[インバウンド処理] [ポリシー/プラグインを有効にする] をクリックします。

3. [CORS] カードをクリックします。[ポリシーの追加: CORS] パネルで、パラメーターを設定し、[追加] をクリックします。

   説明

   CORS ポリシーはモックサービスには適用されません。実際のバックエンドテストサービスを設定する必要があります。

   設定項目	説明
   有効化	[有効化] の右側にあるスイッチをオンにします。 ポリシーを有効にすると、ポリシーに基づいて CORS リクエストが許可されます。 ポリシーを無効にすると、すべての CORS リクエストが拒否されます。
   許可されるオリジン	ブラウザ経由でサーバー内のリソースへのアクセスを許可するドメイン名。設定ルール: すべてのオリジンを許可するには: *。 特定のルートドメインからのオリジンを許可するには: *.example.com。 複数のオリジンを指定するには: http:// または https:// で始まるオリジンを、各オリジンを別々の行に入力します。 説明 このパラメーターは Access-Control-Allow-Origin ヘッダーに適用されます。クライアントリクエストの Origin ヘッダーが設定した許可されたオリジンのいずれかと一致する場合、オリジン間レスポンスの Access-Control-Allow-Origin ヘッダーはクライアントリクエストの Origin ヘッダーに設定されます。
   許可されるメソッド	CORS リクエストで許可される HTTP メソッド。一般的なメソッドには、GET、POST、PUT、DELETE、HEAD、OPTIONS、PATCH があります。 説明 このパラメーターは Access-Control-Allow-Methods ヘッダーに適用されます。
   許可されるリクエストヘッダー	Web ブラウザーの組み込みヘッダー以外に CORS リクエストで許可される追加のヘッダー。設定ルール: すべてのリクエストヘッダーを許可するには: *。 複数のリクエストヘッダーを指定するには、各リクエストヘッダーを別々の行に入力します。 説明 このパラメーターは Access-Control-Allow-Headers ヘッダーに適用されます。
   許可されるレスポンスヘッダー	ブラウザと JavaScript ファイルが取得できるレスポンスヘッダー。設定ルール: すべてのレスポンスヘッダーを許可するには: *。 複数のレスポンスヘッダーを指定するには、各レスポンスヘッダーを別々の行に入力します。 説明 このパラメーターは Access-Control-Expose-Headers ヘッダーに適用されます。
   認証情報を許可	CORS リクエストで認証情報を許可するかどうかを指定します。 説明 このパラメーターは Access-Control-Allow-Credentials ヘッダーに適用されます。
   プリフライトの最大有効期間	OPTIONS メソッドを使用するプリフライトリクエストがキャッシュされる最大期間。 説明 このパラメーターは Access-Control-Max-Age ヘッダーに適用されます。

結果の確認

• 次のコマンドを実行して、テストリクエストを送信します。

  curl -I -H "Origin: http://example.com" -H "Access-Control-Request-Method: GET" -H 'Host: www.test.com' -X OPTIONS http://121.196.XX.XX/demo/item/list 

• 期待される出力:

  HTTP/1.1 200 OK
  allow: GET,HEAD,OPTIONS
  x-content-type-options: nosniff
  x-xss-protection: 1; mode=block
  cache-control: no-cache, no-store, max-age=0, must-revalidate
  pragma: no-cache
  expires: 0
  x-frame-options: DENY
  content-length: 0
  date: Tue, 30 Nov 2021 03:20:31 GMT
  x-envoy-upstream-service-time: 6
  access-control-allow-origin: http://example.com
  access-control-allow-credentials: true
  access-control-allow-methods: GET,POST,PUT,DELETE,HEAD,OPTIONS
  access-control-expose-headers: *
  server: istio-envoy