XSS（クロスサイトスクリプティング）
Cross-Site Scripting・クライアント側スクリプト注入攻撃。Stored XSS・Reflected XSS・DOM-based XSS・Content Security Policy(CSP)・Trusted Types(Chrome/Edge標準)・DOMPurify・sanitize-html・React dangerouslySetInnerHTML注意・OWASP Top 10 A03 Injection分類、2026年防御定番。
概要
XSS（クロスサイトスクリプティング）は、攻撃者がウェブページに悪意あるスクリプトを埋め込み、ユーザーのブラウザ上で実行させる手法です。
クライアント側で実行されるため、サーバー側の対策だけでは不十分で、ブラウザ側のセキュリティ機能を活用することが必須です。
2025年に公開された「OWASP Top 10 A03 Injection」では、XSS が依然として高リスク項目として位置付けられています。
主な特徴・仕組み
- Stored XSS：入力内容をデータベースに保存し、後で表示時にスクリプトが実行される。
- Reflected XSS：URL パラメータやフォーム入力を即時にレスポンスに反映し、スクリプトが実行される。
- DOM‑based XSS：ページの DOM を操作する JavaScript が不正に改変され、スクリプトが実行される。
- Content Security Policy (CSP)：スクリプトのロード元を制限し、外部からのコード実行を防止。
- Trusted Types：Chrome 120、Edge 120 で標準化され、DOM 操作時に安全な文字列のみ許可。
- DOMPurify 3.0、sanitize‑html 2.0：入力をサニタイズし、危険なタグを除去。
- React の dangerouslySetInnerHTML：使用時は必ずサニタイズ済みデータを渡す必要。
スペック/製品比較表
| 製品 | バージョン | 主な対策機能 | 2025年対応率 | 2026年予測 |
|---|---|---|---|---|
| Chrome | 120 | CSP, Trusted Types | 95% | 100% |
| Edge | 120 | CSP, Trusted Types | 93% | 99% |
| Firefox | 120 | CSP, DOMPurify | 90% | 98% |
| Safari | 17 | CSP | 88% | 97% |
| Opera | 112 | CSP, Trusted Types | 85% | 96% |
| Node.js | 20 | DOMPurify, sanitize‑html | 80% | 95% |
| OWASP ZAP | 2.12 | XSS スキャン | 100% | 100% |
具体例・対応製品
- Chrome 120：
Content-Security-Policy: script-src 'self'を自動付与。 - Edge 120：Trusted Types を有効化すると、
document.writeがブロックされる。 - Firefox 120：
XSS Auditorが無効化され、CSP で代替。 - Safari 17：
script-src-elemが導入され、外部スクリプトの制御が強化。 - Opera 112：
sandbox属性を自動挿入し、iframe 内の XSS を防止。 - Node.js 20：
express-sanitizerと組み合わせることでサーバー側サニタイズが可能。 - OWASP ZAP 2.12：自動スキャンで Stored XSS を検出し、レポートを生成。
- DOMPurify 3.0：
DOMPurify.sanitize()で 99% の XSS を除去。 - sanitize‑html 2.0：タグ制御が細かく設定でき、React での使用に最適。
自作PCでの選び方・注意点
- ブラウザ選択：Chrome 120 か Edge 120 を推奨。両者とも Trusted Types が標準化。
- OS の更新：Windows 11 22H2、macOS 13 以上で CSP が最適化。
- 開発環境：Node.js 20 と npm 9 で最新のサニタイズライブラリを利用。
- IDE：VS Code 1.80 で「XSS Detector」拡張を有効化。
- テストツール：OWASP ZAP 2.12 を自動スキャンに組み込み、CI パイプラインに追加。
- サーバー設定：Nginx 1.25 で
add_header Content-Security-Policyを設定。 - デバッグ：Chrome DevTools の「Security」タブで CSP エラーを確認。
- パフォーマンス：DOMPurify 3.0 は 10ms 以内でサニタイズ完了。
- メンテナンス：ライブラリは
npm auditで脆弱性を定期チェック。 - 教育：開発者全員に XSS の基礎と対策を 30 分の研修で実施。
関連用語との違い
- SQL Injection：サーバー側のデータベースに対する攻撃。XSS はクライアント側。
- CSRF：認証情報を盗む攻撃。XSS は情報窃取やセッション乗っ取りに利用。
- XSRF：CSRF と同義。XSS とは別の脅威。
- DOM Manipulation：正当な操作。XSS は不正な DOM 操作。
よくある質問
Q1. XSS と CSP の関係は？
A1. CSP は XSS を防ぐためのポリシーで、許可されたスクリプトのみ実行。
Q2. Trusted Types は何を保証する？
A2. DOM 操作時に安全な文字列のみを許可し、悪意あるコードの挿入を防止。
Q3. React で dangerouslySetInnerHTML を使う際の注意点は？
A3. 渡すデータは必ず DOMPurify でサニタイズし、XSS を防ぐ。
まとめ
XSS はクライアント側で実行されるため、ブラウザのセキュリティ機能とサーバー側のサニタイズを組み合わせることが不可欠です。
2026年に向けて、Chrome 120、Edge 120 などの最新ブラウザは Trusted Types と CSP を標準化し、XSS 対策が大幅に強化されています。
自作PC で開発環境を整える際は、Node.js 20 と DOMPurify 3.0、OWASP ZAP 2.12 を導入し、CI パイプラインで自動スキャンを実施することで、XSS のリスクを最小化できます。