【こんてんつせきゅりてぃぽりしー】

Content Security Policy とは？

最終更新: 2026年10月4日

💡 「このページが読み込んでいいもの」を制限する

Webページが読み込めるリソースの出所を制限するセキュリティ機構。XSS攻撃の被害を軽減する。

📌 このページのポイント

矢印はCSPを伝える方向と、ブラウザーの判断を示します。script-srcだけを設定した例なので、画像やCSSまで同じ制限になるとは限りません。CSPだけで全てのXSSを防ぐことはできません。

ひよこ

CSPって具体的に何をするの？

ペンギン先生

例えばContent-Security-Policy: script-src 'self'なら、外部ファイルのスクリプトは同じオリジンのものだけ許可するよ。別の出所から読み込むスクリプトはブロックされる。この例だけで、画像やCSSの読み込み元まで制限されるわけではないんだ

ひよこ

設定でサイトが動かなくならない？

ペンギン先生

必要なスクリプトまで禁止すると、機能が動かなくなることがあるよ。Content-Security-Policy-Report-Onlyなら、違反をブロックせずに調べられる。報告先にはreport-toなどを設定する。古いreport-uriは非推奨で、対応状況に合わせて併記する場合もあるんだ

ひよこ

inline scriptはどう扱う？

ペンギン先生

script-srcや、その代わりになるdefault-srcを設定すると、通常は直書きのスクリプトも制限されるよ。許可する方法には、応答ごとに新しく予測困難なnonceを付ける方法や、内容のハッシュ値を指定する方法がある。'unsafe-inline'で広く許可すると、この保護が弱くなるんだ

ひよこ

CSPがあればXSSは全部防げる？

ペンギン先生

設定したルールによるので、CSPだけで完全に防げるわけではないよ。許可した出所自体に問題がある場合も考える必要がある。出力するデータを適切にエスケープしたり、必要なHTMLをサニタイズしたりする対策と組み合わせるんだ。meta要素でも一部を設定できるけれど、報告のみモードなどは使えないよ

まとめ：ざっくりこれだけ覚えればOK！

「CSP」って出てきたら「ページが読み込むものや実行するものを制限する設定」と思えばだいたいOK！

📖 おまけ：英語の意味

「Content Security Policy」＝コンテンツセキュリティポリシー

💬 Content（コンテンツ）のSecurity（安全性）をPolicy（方針）で守る仕組みだよ

参考資料