1つのAWS LambdaでSPA(CloudFront編) のバックアップ(No.2) - 闘うITエンジニアの覚え書き

• 静的コンテンツ(HTML、CSS、JS等) はS3に配置する。
• 動的コンテンツは Lambda で提供する。
• 動的コンテンツへのリクエストの場合は、Lambda@Edge を使用してレスポンスを返却する
• 作成する Lambda は1つのみとし、リクエスト情報から処理を判定する。(Lambda内部でルーティング)

Lambda@Edge では、Node.js Lambda 関数により返却するコンテンツをカスタマイズする事ができる。

Lambda 関数が実行出来るタイミングは以下の通り。

• CloudFront がビューワーからリクエストを受信したとき (ビューワーリクエスト)
• CloudFront がリクエストをオリジンに転送する前 (オリジンリクエスト)
• CloudFront がオリジンからレスポンスを受信したとき (オリジンレスポンス)
• CloudFront がビューワーにレスポンスを返す前 (ビューワーレスポンス)

当記事では、上記の「オリジンリクエスト」イベントによってLambdaをトリガーし、動的コンテンツか静的コンテンツかを判定する。
動的コンテンツへのリクエストだった場合はLambd 内でレスポンスデータを作成/返却する。
静的コンテンツへのリクエストだった場合は何もしない。(そのままオリジンに対してリクエストさせる)

[参考]
CloudFront Lambda@Edge での AWS Lambda の使用
https://docs.aws.amazon.com/ja_jp/lambda/latest/dg/lambda-edge.html

Lambda@Edge を使用したエッジでのコンテンツのカスタマイズ
https://docs.aws.amazon.com/ja_jp/AmazonCloudFront/latest/DeveloperGuide/lambda-at-the-edge.html

Lambda@Edge を使用したエッジでのコンテンツのカスタマイズ » リクエストとレスポンスを使用する
https://docs.aws.amazon.com/ja_jp/AmazonCloudFront/latest/DeveloperGuide/lambda-generating-http-responses.html