「Webサイトの泥棒」を防ごう！XSS（クロスサイトスクリプティング）の仕組みと守り方
こんにちは。日々、Webという広大な戦場でシステムの守りを固めているエンジニアです。
今日は、初心者の方が最初にぶつかる大きな壁、「XSS（クロスサイトスクリプティング）」についてお話しします。「名前は聞くけれど、結局何をされたら怖いのかよくわからない」「難しいツールはハードルが高い」……そんな悩みを抱えていませんか？
大丈夫です。今日は専門用語を並べるのではなく、私たちの身近な「家の防犯」に例えて、この攻撃の正体と、その見破り方を紐解いていきましょう。
—
そもそもXSSって何？ 「家の鍵」で例えると
想像してみてください。あなたは、お客さんから「メモ」を受け取って、それを玄関の掲示板に貼り出す役割をしています。
もし、ある悪意ある人が、「このメモを読んだ全員の家の合鍵を、こっそり盗むプログラム」が書かれたメモを渡してきたらどうなるでしょうか？
あなたが何も疑わずにそのメモを掲示板に貼ってしまうと、それを見た隣人たちは、知らぬ間に自分の家の鍵を奪われてしまいますよね。
Webの世界でのXSSもこれと全く同じです。
1. 攻撃者： 悪意あるスクリプト（命令文）を、掲示板や検索窓などの「入力欄」に入力する。
2. Webサイト： その命令文を「ただの文字」と勘違いして、他のユーザーの画面にそのまま表示してしまう。
3. 被害者： サイトを見た瞬間、ブラウザがその命令を実行し、ログイン情報（クッキーなど）が盗まれてしまう。
これが、XSSの恐ろしいメカニズムです。
—
Burp Suiteで「泥棒の侵入経路」を探してみよう
セキュリティの現場では、Burp Suiteというツールをよく使います。これは、Webサイトとの通信を一度キャッチして、中身を書き換えてテストするための「虫眼鏡」のようなツールです。
1. 自動スキャンで「隙」を見つける
Burp Suiteには、自動で「ここ、鍵が空いてますよ！」と教えてくれるスキャナー機能があります。これは、泥棒が家の周りをぐるりと回って、窓の鍵がかかっているか次々と試していくようなものです。
2. 手動での検証（ペイロード注入）
自動ツールだけでなく、エンジニア自身が「ここにこんな文字を入れたら、どう反応するかな？」と試すことも重要です。例えば、検索ボックスに以下のような文字列を入力してみます。
もし、画面上に「XSS脆弱性があります！」というポップアップが出たら、その場所は「侵入可能」だというサインです。この瞬間、私たちは「あ、ここに防犯カメラ（対策）をつけなきゃ！」と気づくことができるわけですね。
—
今日からできる「防御の鉄則」
では、どうやって防げばいいのでしょうか？ 基本は「受け取ったメモは、決してそのまま信じないこと」です。
1. 「エスケープ」処理を徹底する
プログラムを書く際、入力された文字をそのまま表示せず、HTMLとして動かないように変換（エスケープ）します。
<を<に変換する>を>に変換する
こうすることで、ブラウザは「あ、これは命令文じゃなくて、ただの文字だな」と理解して、実行しなくなります。最近のフレームワーク（ReactやVueなど）は、デフォルトでこの処理を自動でやってくれるので、賢く活用しましょう！
2. 「CSP（コンテンツセキュリティポリシー）」という防犯ベル
開発者として、ぜひ覚えてほしいのが「CSPヘッダー」です。これは、Webサイトの応答に含める「防犯ルールブック」のようなものです。
HTTPレスポンスヘッダーの例
「外部から怪しいスクリプトを読み込むな！」という指示
Content-Security-Policy: default-src 'self'; script-src 'self';
このヘッダーをサーバーから送るだけで、万が一どこかに穴があったとしても、ブラウザが「許可されていない怪しい命令は実行しません！」と防波堤になってくれます。
---
まとめ：セキュリティは「泥臭い」積み重ねから
XSSの対策に「これ一つで完璧！」という魔法はありません。
- ユーザーからの入力は、すべて疑うこと。
- 表示する時は、必ず「ただの文字」として扱うこと。
- 防犯ベル（CSP）を鳴らしておくこと。
これらは、泥臭いですが、非常に強力な防衛ラインです。
もし今、自分のサイトで不安な場所があれば、まずは小さな入力欄から「
コメント