【入門編】 Content-Security-Policy(CSP)によるクライアントサイド攻撃の防御 – オフェンシブセキュリティ & リバースエンジニアリング防御ガイド

玄関の鍵をかけたはずなのに…？Webの「泥棒」を防ぐ最強の防犯術「CSP」入門

こんにちは！セキュリティの世界へようこそ。今日は、Webサイトという「あなたの大切な家」を、悪意ある侵入者から守るための強力な防犯システム「CSP（Content Security Policy）」についてお話しします。

「サイトに鍵（SSL/TLS）はかけてあるから大丈夫！」と思っていませんか？実は、それだけでは不十分なんです。今日は、玄関の鍵とは別に、家の中に誰を入れ、何をさせるかを細かく管理する「CSP」という仕組みについて、一緒に紐解いていきましょう。

—

1. なぜ「鍵」だけでは防げないのか？（XSSの脅威）

想像してみてください。あなたは玄関の鍵をしっかり閉めて出かけました。でも、もし家の中に「怪しい訪問者」が最初から紛れ込んでいたらどうでしょう？

Webの世界でこの「怪しい訪問者」にあたるのが、クロスサイト・スクリプティング（XSS）という攻撃です。攻撃者は、掲示板やフォームの隙間から、悪意のあるコード（泥棒の分身）をあなたのサイトに忍び込ませます。

このコードが実行されると、あなたのサイトを訪れたユーザーのIDやパスワード、ブラウザのクッキー（鍵束）が、いとも簡単に盗まれてしまいます。

—

2. CSPは「入館証」システム

CSP（Content Security Policy）を一言で言うと、「ブラウザに対して、許可されたもの以外は絶対に実行させない」という強力な入館証ルールです。

通常、Webサイトは「どこの誰が書いたコードでも、とりあえず実行しちゃう」という、少しお人好しな性質を持っています。CSPを設定すると、ブラウザに対してこう命令できるようになります。

「うちのサイトでは、自分が許可したスクリプト（信頼できるファイル）以外は、絶対に動かさないでくれ！」

—

3. 実践！CSPを設定してみよう

CSPは、Webサーバーから送られる「HTTPレスポンスヘッダー」という名札のようなもので指定します。一番シンプルな設定を見てみましょう。

# すべてのコンテンツを「自分のサイト内のみ」に制限する設定例
Content-Security-Policy: default-src 'self';

この default-src 'self' という設定は、「このサイトで読み込む画像もスクリプトも、すべて自分のサーバー内にあるものだけ許可するよ」という意味です。これで、外部の怪しいサーバーから送られてくるスクリプトは、ブラウザによって強制的にブロックされます。

注意！インラインスクリプトは要注意

よくあるのが、HTMLの中に直接 <script>alert('ハッキング！');</script> のように書くケースです。これは泥棒が家の中に直接潜り込んでいるのと同じ。CSPを導入すると、こうした「HTML直書きのスクリプト」も動かなくなります。

—

4. 現代的な防犯術：nonceとstrict-dynamic

「でも、どうしても動的なスクリプトが必要な時があるよね？」という場合のために、現代的なテクニックがあります。

nonce（ノンス）を使う

nonce とは、使い捨ての「入場チケット」のようなものです。

1. サーバーがページを表示するたびに、ランダムな文字列（nonce）を発行します。
2. <script nonce="ランダムな文字列"> と書かれたスクリプトだけを許可します。
3. 攻撃者が勝手にスクリプトを埋め込もうとしても、正しい nonce を持っていないため、ブラウザは無視します。

strict-dynamicを使う

さらに最新のブラウザでは、'strict-dynamic' という設定を使うことで、管理が非常に楽になります。これは「信頼できるスクリプトが呼び出した先のスクリプトも許可する」という仕組みで、複雑なWebサイトでも守りを固めやすくしてくれます。

# 推奨される現代的なCSP設定の例
Content-Security-Policy: script-src 'nonce-EDNnf03nceIOfn39fn3e9h3sdf' 'strict-dynamic'; object-src 'none'; base-uri 'self';

script-src 'nonce-...': 正しいチケットを持つスクリプトのみ許可。
object-src 'none': Flashなどの古いプラグインを無効化（ここはオフにするのが鉄則です）。
base-uri 'self': リンクの起点先を自分のサイトに固定し、悪意あるサイトへの誘導を防ぎます。

—

5. 最後に：一歩ずつ進めよう

CSPの設定は強力ですが、一気に厳しくすると「今まで動いていた機能が動かなくなった！」という事態になりがちです。まずは、Content-Security-Policy-Report-Only というヘッダーを使ってください。

これを使うと、「もしこのCSPを適用したら、どこがブロックされるか？」というレポートだけをブラウザから受け取ることができます。実際にブロックされることなく、安全な設定かどうかをテストできるんです。

セキュリティ対策に「終わり」はありません。でも、今日学んだCSPを導入するだけで、あなたのサイトは攻撃者にとって「非常に侵入しにくい要塞」へと進化します。

まずは今日、テスト環境でヘッダーを眺めるところから始めてみませんか？一歩ずつの積み重ねが、ユーザーを守る最強の盾になりますよ！