
こんな悩みを解決できる記事を書きました!
僕は現役フリーランスエンジニア(歴10年)で、資格は13個保有しています。
「CloudFrontのLambda@EdgeでCSPを設定する方法を知りたい」とお考えではありませんか?
セキュリティを強化するためにCSP(コンテンツセキュリティポリシー)を設定したいものの、CloudFrontでの実装方法がわからず困っている方も多いでしょう。
Lambda@Edgeを使えば、CloudFrontを通るすべてのレスポンスにCSPを適用できます。



けっこう簡単なのでサクッと解説します。
ということで、本記事ではCloudFrontのLambda@EdgeでCSPを設定する方法を解説します。





すぐ読み終わるので、ぜひ最後まで読んでくださいませ。
CloudFrontのLambda@EdgeでCSPを設定する方法
Lambda@Edgeを利用すれば、CloudFrontを経由するすべてのレスポンスヘッダーにCSPを追加できます。
AWS Lambdaの管理画面で新しい関数を作成し、ランタイムをNode.jsに設定します。
exports.handler = async (event) => {
const response = event.Records[0].cf.response;
response.headers['content-security-policy'] = [{
key: 'Content-Security-Policy',
value: "default-src 'self'; script-src 'self' 'unsafe-inline'; style-src 'self' 'unsafe-inline';"
}];
return response;
};
上記のコードをLambdaに設定し、CloudFrontのviewer-response
イベントで実行されるようにします。
設定が完了したら、CloudFrontのレスポンスヘッダーを確認し、CSPが適用されているか検証します。
よくある質問
Lambda@Edgeのデプロイにかかる時間はどのくらいですか?
デプロイには通常5〜10分かかります。
CloudFrontのエッジロケーションに変更が反映されるまで時間がかかるため、適用後すぐに確認できない場合があります。
Lambda@Edgeのコストはどのくらいですか?
リクエスト回数に応じて課金されますが、1ヶ月あたり数百万リクエストで数百円程度です。
無料枠もあるため、小規模なサイトなら追加コストなしで運用できます。
まとめ
今回は、CloudFrontのLambda@EdgeでCSPを設定する方法について解説しました。
以下が本記事のまとめになります。
CloudFront経由のレスポンスにCSPを適用し、ウェブサイトのセキュリティを強化しましょう。



最後までお読みいただき、ありがとうございました!
- クソおすすめ本



海外のエンジニアがどういった思考で働いているかが理解できます。
海外に行く気はないけど海外エンジニアの動向が気になる雑魚エンジニアにおすすめです(本当におすすめな本しか紹介しないのでご安心を)。