【しーえすぴー】
CSP（コンテンツセキュリティポリシー） とは？
最終更新:
💡 ページの読み込みと実行に、許可の方針を示す
Webページのリソース読み込みやスクリプト実行などをブラウザーで制御する方針。CSPの指定、nonce・ハッシュ、Report-Onlyと違反報告を解説します。
📌 このページのポイント
- HTTP応答ヘッダーなどで、ブラウザーへ制御方針を伝える
- script-src・img-srcなどで対象ごとに条件を指定する
- インラインスクリプトの制限は、指定した方針による
- Report-Onlyで影響を調べ、通常の対策と組み合わせる
ひよこ CSPは、何を制限する？
ペンギン先生 ひよこ どう書けば、意味が分かる？
ペンギン先生 ひよこ CSPがあれば、インラインは全部禁止？
ペンギン先生 script-srcか、代わりに使うdefault-srcを指定した方針では、追加の許可がなければインラインのJavaScriptが制限される。CSPという名前のヘッダーがあるだけで、常に同じ制限になるわけではないよ。許可する内容を確認するんだ。
ひよこ 必要なインライン処理は、どうする？
ペンギン先生 script要素の処理は、nonceやハッシュで許可する方法がある。nonceは応答ごとに生成する予測できない値を、方針と対象の要素へ設定するよ。ハッシュは内容に対応する値なので、処理を変えたら更新が必要。onclickなどの属性を同じ方法でそのまま許可できるわけではない。
ひよこ いきなりブロックしても、大丈夫？
ペンギン先生 まずContent-Security-Policy-Report-Onlyで影響を調べる方法がある。その方針では監視だけで制限を強制しない。実際の画面や機能を確認し、必要な読み込みと報告を整理してから、適用する方針へ進めるよ。
もっと詳しく知りたい人へ
Report-Onlyを書けば、通知も自動で届く？
違反を受け取る先の設定が必要です。report-toとReporting-Endpointsを使う方法があり、旧report-uriとの対応も確認します。ブラウザーの対応や報告の届き方を含め、記録がないだけで違反なしと決めません。
metaタグでも、同じ設定ができる？
一部のCSPはmetaタグで指定できますが、Report-Only、frame-ancestorsやreport-uriなどはmetaで同じように使えません。配信できる応答ヘッダーと、制御したい内容を確認します。
📖 おまけ：英語の意味
「Content Security Policy」 ＝ コンテンツのセキュリティ方針
💬 読み込み元だけでなく、スクリプトを許可するnonceやハッシュ、埋め込みなどの条件も扱います。方針を設定しただけで、すべての脆弱性がなくなるわけではありません。