CloudFront + API Gateway

CloudFront + API Gateway

API Gatewayの前にCDNであるCloudFrontを配置します。

CloudFront + API Gateway

「ディストリビューションを作成」をクリックします。

CloudFront + API Gateway

API Gatewayはhttpsのみサポートしているので「httpsのみ」を選択します。

CloudFront + API Gateway CloudFront + API Gateway

キャッシュビヘイビアの設定をします。

CloudFront + API Gateway CloudFront + API Gateway

「Managed-CORS-CustomOrigin」…リクエストヘッダにOriginヘッダが追加される

CloudFront + API Gateway

「Managed-CORS-With-Preflight」…レスポンスヘッダにAccess-Control-Allow-Origin:*が追加される

C:>curl -X POST -i -k -H "Content-Type: application/json" -H "Origin:'https://uperworld.com'" https://d1prrd8oyv2yx3.cloudfront.net/dev/mansion
HTTP/1.1 200 OK
Content-Type: application/json
Content-Length: 15
Connection: keep-alive
Date: Thu, 22 Dec 2021 02:15:32 GMT
x-amzn-RequestId: 61d8237f-cfd8-4a96-ace3-0bb8d0912459
x-amz-apigw-id: dhqWtGxwtjMF5LQ=
X-Amzn-Trace-Id: Root=1-63a3bdc4-75f0d17b2d91c54f03c93601;Sampled=0
Via: 1.1 874b64d97046903d1eac41de7eeaf51e.cloudfront.net (CloudFront), 1.1 79184721bfa1abb97e50c88266c01b9a.cloudfront.net (CloudFront)
X-Amz-Cf-Pop: ICN54-C2
X-Cache: Miss from cloudfront
X-Amz-Cf-Pop: ICN51-C2
X-Amz-Cf-Id: 5Fm_gYCwJ2jicsMMMXzcPpwO1-jEOi2Oz0dJ2Ui93H2-ZWbjbhE4Cg==
Access-Control-Allow-Origin: * ★
Access-Control-Expose-Headers: * ★

{"key":"value"}

「ディストリビューションを作成」をクリックして完了です。

参考サイト

カスタム CloudFront ディストリビューションで API Gateway をセットアップする
エッジ最適化された API エンドポイントが Amazon API Gateway に必要ですが、Amazon CloudFront ディストリビューションをより詳細に制御する必要があります。独自のディストリビューションを作成して使用するに...
Amazon CloudFront がレスポンスヘッダーポリシー を導入 | Amazon Web Services
はじめに Amazon CloudFront は、エッジロケーションとグローバルネットワークを利用して、静的お

コメント

タイトルとURLをコピーしました