XSSの「もしも」に備える！家の防犯に例えるブラウザ機能制限（Permissions-Policy）入門
こんにちは！セキュリティの現場で日々、泥臭いインシデントと戦っているエンジニアです。
今日は、Web開発の現場で避けて通れない「XSS（クロスサイトスクリプティング）」と、それを食い止めるための「Permissions-Policy（パーミッションズ・ポリシー）」についてお話しします。
セキュリティと聞くと難しく感じますが、実は私たちの身の回りの「防犯」と全く同じ考え方なんです。一歩ずつ、丁寧に紐解いていきましょう。
—
1. XSS（クロスサイトスクリプティング）って何？
Webサイトに「悪意のあるスクリプト（プログラム）」を紛れ込ませる攻撃のことです。
これを、「あなたの家に泥棒が忍び込んで、こっそり勝手なことをする」と想像してみてください。
- 反射型： 泥棒が「あなたの家の鍵を開けて！」と叫び、その声に反応してあなたが自分で鍵を開けてしまうようなもの。
- 格納型： 泥棒が掲示板などのみんなが見る場所に「この家は空き巣に入りやすいですよ」というメモを貼っておき、それを見た人が被害に遭うもの。
- DOM型： 泥棒が玄関の鏡（Webページの一部）をすり替えて、偽物の風景を見せるようなもの。
共通しているのは、「あなたのブラウザが、泥棒の言いなりになって動かされてしまう」という点です。
—
2. 泥棒の被害を最小限にする「部屋の鍵」の考え方
もし泥棒が家に入り込んだとしても、「金庫室（カメラやマイク）」には絶対に入れないようにしていれば、最悪の事態は防げますよね？
これが今回紹介する「Permissions-Policy」の役割です。
Webサイトのヘッダーに「このサイトではカメラやマイクは使わせない！」と宣言しておくことで、万が一XSSでスクリプトが動いても、ブラウザがその機能を強制的に遮断してくれるのです。
「念のため、許可しない」というゼロトラストの精神こそが、現代のセキュリティの要です。
—
3. Permissions-Policy を設定してみよう
Webサーバーからブラウザへ送るレスポンスヘッダーに、以下のような設定を追加します。
設定例：カメラとマイクを完全に無効化する
セキュリティヘッダーの例
Permissions-Policy: camera=(), microphone=(), geolocation=()
この設定の意味は簡単です。
camera=()：カメラは誰にも許可しない（空のカッコが「禁止」を意味します）microphone=()：マイクも誰にも許可しないgeolocation=()：位置情報も取得させない
たったこれだけで、攻撃者があなたのサイトでカメラを起動させようとしても、ブラウザが「そんな権限はありません！」とエラーを返してくれるようになります。
特定のサイトだけ許可したい場合
もし、信頼できるドメイン（例：自社の決済システムなど）だけで機能を使わせたい場合は、以下のように指定します。
自社のドメインのみマイクの使用を許可する
Permissions-Policy: microphone=(self “https://pay.example.com”)
self：自分のサイト内ではOK。"https://pay.example.com"：特定の決済サイトからの呼び出しはOK。
—
4. 現場で役立つ運用のコツ
新人の皆さんに一つだけアドバイスがあります。いきなり全ての機能を制限すると、サイトの表示が崩れたり、必要な機能が動かなくなったりすることがあります。
1. まずは現状調査： 自分のサイトで本当に必要な機能は何か（カメラは必要か？位置情報は使うか？）を洗い出してください。
2. 少しずつ導入： 使っていない機能から順番に () で閉じていくのが安全です。
3. ブラウザのデベロッパーツールを確認： ChromeなどのブラウザでF12キーを押し、「Console（コンソール）」タブを見てください。もし制限に引っかかっていれば、「Permissions policy violation」というエラーが出ています。これをヒントに調整していきましょう。
—
まとめ：セキュリティは「積み重ね」
XSSを防ぐための根本的な対策は「入力値のチェック」や「出力のエンコード」ですが、完璧なプログラムを書くのは人間である以上、非常に困難です。
だからこそ、「プログラムのミスがあっても、被害を広げないための防波堤（Permissions-Policy）」が重要になるんです。
まずは自分のサイトのヘッダーを確認することから始めてみてください。それが、ユーザーを守るための最初の一歩になります。応援していますよ！
コメント