XSSチートシート：ハードコア・セキュリティエンジニアのための実践ガイド

XSSカンニングペーパーが重要な理由

最新のフレームワーク≠XSSフリー。 React/Angular/Svelteの自動エスケープ機能はテンプレートの穴を減らすが、実際のシステムではまだDOM APIの誤用、安全でないサードパーティ製ウィジェット、寛容なMarkdown/WYSIWYGが出荷されている、 javascriptを使用しています： URLハンドラ、SVG/MathML、JSONPの名残、そして暗黙の信頼性 場所/ハッシュ/ポストメッセージ.

ベクターの生態系は進化する。 PortSwiggerは、以下の方法でペイロードに継続的に注釈を付ける。 イベント / タグ / 属性 / ブラウザ"トライバルメモリー "を大幅に減らすことができる。このキュレーションは、ペイロードの分類法を再発明することなく、広範囲をカバーする必要がある場合に威力を発揮する。

フィルタリングだけでは防御にはならない。 OWASPはこのことを10年以上繰り返してきた。 データのレンダリングコンテキスト.組み合わせ 適切な出力エンコーディング, 消毒 (ユーザーが作成したHTMLの場合）、 方針 (CSP、信頼されたタイプ）、そして フレームワーク衛生 は譲れない。

攻撃面×コンテキスト行列

このマトリックスを 実行チェックリスト Playwright/Burp/Nucleiの検証やコード監査をスクリプト化する場合。各行はレンダリング コンテキスト リスキーに 流し台共通 エントリーその 先手そして 確認方法 スケールで。

実際に実行できる最小限の再現可能な例（MRE

1) 属性コンテキスト＋ゼロ・インタラクション・トリガー

。

なぜそれが重要なのか： フォーカスイベントは、多くのUXフロー（検索フィールド、クイックプロンプト）でロード時に自己トリガーします。で置き換えてください。 。 または <img onerror="…"> 異なるトリガーのセマンティクスをテストする。

2) SVGキャリア + URLハンドリングの癖

<svg><a xlink:href="javascript:fetch('/beacon?svg')">x</a></svg>

なぜそれが重要なのか： SVGは別個のXML名前空間であり、歴史的に風変わりな属性解析が行われる。チームはしばしばSVGをサニタイズするのを忘れたり、Markdownレンダラーを通して許可したりする。

3）DOMベースのXSS（ソース→シンクの系譜）

<script>
  const q = new URL(location).hash.slice(1);
  document.getElementById('out').innerHTML = q; // sink
</script>
<div id="out"></div>

なぜそれが重要なのか： 古典的な「URLから読み込み、DOMに書き込む」アンチパターン。レガシーなサイトや社内ツールではどこにでもある。で修正する。 文脈訂正エンコーディング また、HTMLシンクに直接書き込まないこと。

ディフェンシブ・ベースライン（スローガンではなくエンジニアリング第一主義）

1. コンテキストによる出力エンコーディング。 エンコード HTML / 属性 / URL / JS にそれぞれ対応しています。フレームワークの自動エスケープは 手巻きDOM を更新した。
2. ユーザーHTMLのサニタイズを許可する。 ビジネス・ロジックがリッチ・コンテンツ（コメント、経歴、ナレッジ・ベース）を必要とする場合は、次のように使用します。 DOMピュリファイ (ブラックリストの "ワードチョッピング "を避ける。
3. コンテンツ・セキュリティ・ポリシー。 始めよう script-src 'self' + デフォルトではインラインブロック。 object-src 'none' そして ベース-ウリ 'none'.採用 信頼できるタイプ で、コンパイル時/実行時に安全なDOM APIを強制する。
4. 危険なAPI監査。 禁止またはゲート eval/new 関数/setTimeout(文字列) および動的なJSON→コード変換。ビルド時にESLintルールで強制し、違反が表面化したらCIを失敗させる。
5. コードに従ってテストと検証を行う。 ペイロード再生の自動化ペア CSP違反報告 そして ゲートウェイとログの相関 デモ可能なポップアップ」と「デモ可能なポップアップ」を分ける エクスプロイタブル ビジネスにとって重要なパス。

カンニングペーパーからパイプラインへ：出荷するオートメーション

ベクター・ライブラリー」から「プロダクション・グレードの保証」までの最短経路は、5段階のループである：

1. 文脈の発見。 静的スキャン（ESLintルール、セマンティックgrep）＋潜在的なシンクをタグ付けする実行時プローブ（以下「プローブ」という。インナーHTML属性セッター、ナビゲーション・ポイント）。
2. ベクトルスケジューリング。 各シンク/コンテキストを キュレーション・プール ペイロード（属性イベント、タグの癖、URLハンドラ）、ブラウザによるフィルタリング、機能フラグ。
3. ヘッドレスプルーフ。 ベクターごとにPlaywright/Chromiumを実行。コンソール、ネットワークをキャプチャ、 CSP違反そしてDOM変異。
4. 信号の相関。 ヘッドレスの知見に加わる APIゲートウェイ そして アプリログ を "ノイズ対本物 "に分類する。これにより、初日から偽陽性を排除することができる。
5. エビデンスファーストの報告。 スクリーンショット、HTTPトレース、DOMのbefore/after差分、ポリシー違反を自動添付-その後 スコア信頼度 エンジニアは何から始めればいいのかがわかる。

ミニマル・プレイライト再生（ドロップイン・スニペット）

import { chromium } from 'playwright'；

const vectors = [
  '#<img src="x" onerror="fetch(\">',
  '#<svg onload="fetch(\">'
];

(async () =&gt; {
  const browser = await chromium.launch()；
  const page = await browser.newPage()；
  page.on('console', m =&gt; console.log('console:', m.text()))；
  page.on('pageerror', e =&gt; console.error('pageerror:', e))；
  for (vectors の const v) { { (vectors の const v)
    await page.goto('https://target.example/' + v)；
    await page.screenshot({ path：evidence_${encodeURIComponent(v)}.png` })；
  }
  await browser.close()；
})();

それを生産する： 各ランにソース→シンクの系統ラベルを追加する。 CSPレポートのみ 違反を収集し、保管する DOMの差分 PRでリグレッションを明白にする。

フレームワークの現実

• React/JSX。 自動エスケープは役に立つが dangerouslySetInnerHTML と生 ref.current.innerHTML = ... シンクを開き直す。消毒液とTrusted Types Policy（信頼されるタイプ）の後ろにゲートを設ける。
• アンギュラー。 サニタイザーはちゃんとしたものだが bypassSecurityTrustHtml APIや類似のAPIは穴を開けることができる。すべての迂回を文書化し、吟味されたソースに制限する。
• 次／次／SSR サーバーが生成するページは、以下のものだけをエコーしなければならない。 エンコード コンテンツサーバーのミスを "クリーンアップ "するために、クライアントのフレームワークに頼ってはいけない。
• Markdown/MDX/WYSIWYG。 として扱う。 HTMLインジェスト 問題です。レンダラーを強化し、信頼できないウィジェットをサンドボックス化し、イベント属性/URLハンドラをパージしてください。
• SVG/MathML。 どうしても許可したい場合は、機能セットに上限を設け、XML名前空間を理解するサニタイザーを実行する。重要でなければ 安全ラスター をサーバー上に置く。

実際に必要なペイロード・ファミリー

• オンイベント・オートトリガー： オートフォーカス, オンロード, オンエラー, アニメーションスタート, オンフォーカス, オンポレンター.ユーザーのクリックなしで悪用可能性を証明するには最適です。
• URLハンドラ： javascriptを使用しています：, のデータがある：そして時折 vbscript： (レガシー）。allowlistを強制する。
• テンプレートの衝突： 素朴なフィルターをすり抜けるスプリット／コンキャットのトリック（属性コンテキストから抜け出してHTMLに再入力するなど）。
• DOMを叩く： ID/名前を書き換えてコードパスをリダイレクトし、シンクに着地させる。
• 突然変異と観察者のタイミング： 初期ロードの代わりに動的アップデートを利用するトリガー。

CSPと信頼されるタイプ：「あると便利」からガードレールへ

• せいやくじゅうそくもんだい は、スクリプトのソースとインライン実行を制約するポリシー言語を提供する。厳格に開始し、吟味されたケースにのみ拡大する。ペア レポート-ウリ/報告先 収穫 違反報告 テレメトリーで
• 信頼できるタイプ 開発者にパスさせる ポリシー作成 値を DOM API に取り込む。インナーHTML, アウターHTML, 挿入隣接HTML, Range#createContextualFragment).これにより、DOM XSSの全クラスが構造上排除される。
• ロールアウトのヒント でCSPを実行する。 レポートのみ 2スプリントの間、違反を修正し、その後実施する。単一の アプリ全体のTrusted Typesポリシー そして、審査されたビルダーを通じてのみ「祝福された」HTMLを発行する。

エンジニアに悪用可能性を証明するには

1. リプロスクリプト:ワンライナー（URLまたはcurl）と再生するPlaywrightブランチを指定してください。
2. DOM差分:変更された正確なノードとパス (#app > .profile > .bio).
3. コールスタック:JSシンクの場合は、以下のスタックトレースを含めてください。 eval/関数 フック
4. CSPの証拠:インライン/スクリプトのsrc違反に違反JSONを添付。
5. ビジネスシナリオ:「からセッション・トークンを流出させることができる。 /アカウント 注入された <img> beacon "は "alert popped "に勝る。

このxssチートシートをPenligentで実行する

すでに 寡黙 を自動化されたペンテスト・プラットフォー ムとして使用することで、上記を1つの実行可能なテンプレートにパッケージ化することができる：

• タスクテンプレート：「XSS Recon + Validate"。 エージェントは偵察（サブドメイン/ポート/フィンガープリント）を実行し、検出されたコンテキストごとにベクターをスケジュールし、ヘッドレスリプレイを実行します。 相関信号 丸太やゲートウェイでノイズをカットする。
• 証拠第一の輸出。 調査結果には以下が含まれる 信頼度再現可能なステップ、スクリーンショット、CSP違反ログ、エンジニアが信頼できるDOM差分。
• 最も役に立つ場所 レガシー・スタックとSPAスタックが混在する大規模なスコープ、またはCSP/Trusted Typeに移行するチームで必要なもの プルーフ・ドリブン・トリアージ ペイロードの豆知識よりも。

ベテランチームにありがちな落とし穴

• アウトプットではなく、インプットをサニタイズする。 HTMLを受け入れる必要がある場合は、以下のようにサニタイズしてください。 そして この2つは互換性がない。
• 許可 javascriptを使用しています： "柔軟性 "のために。 特定のプロトコルのみをホワイトリストに登録する。https, メールたぶん テル).
• Markdownを "安全なテキスト "として扱う。 それはレンダラーであり、プラグインが安全性を決定する。許可されたタグ/属性を監査する。信頼できないSVGに対してはサーバーサイドでのラスタライズを考慮する。
• HTML以外のコンテキストを無視する。 URL連結やJSON→JSのエバールは常習犯。コードに文字列を使わない」ポリシーを強化する。
• 一つの環境を信頼する。 ヘッドレスでは失敗するXSSも、モバイルのChromiumや古いデスクトップビルドでは成功する可能性がある。このような場合は ブラウザマトリックス 価値の高いアプリのために。

生産チェックリスト、CIバッジの横にピンで留める

• コンテキスト対応 エンコーディング HTML/Attr/URL/JSのユニットテストを備えたユーティリティ
• DOMピュリファイ (または同等の)リッチコンテンツパスのためのハード化されたコンフィグにロックされる。
• せいやくじゅうそくもんだい と script-src 'self' (unsafe-inlineなし）、 object-src 'none', ベース-ウリ 'none'テレメトリーに接続された違反コレクション
• 信頼できるタイプ 生文字列のシンクをブロックするためのポリシー＋ビルド時のlintルール
• ESLintルール禁止 eval/new 関数/setTimeout(文字列) (CI施行)
• 劇作家 リプレイ・スイート PortSwiggerスタイルのベクターで播種。ベクターごとのスクリーンショットとDOM差分。
• 自動化 信号相関 アプリのログ / APIゲートウェイのイベント
• エビデンス・ファーストのレポート 信頼度 およびビジネス・インパクト・ノート
• PRテンプレートのセリフ："新しいHTMLシンクを導入？""サニタイザーを回避？"「TTポリシーの更新？
• サードパーティウィジェット/WYSIWYG/Markdown設定の定期的な見直し

よくあるご質問

Q: すでにReact/Angularを使っている場合でも、これは必要ですか？
A: はい。フレームワークはすべてのDOM書き込み、サードパーティ製ウィジェット、Markdown/SVGを取り締まるわけではありません。サニタイザー＋CSP＋TTは必要ですし、信頼できないデータを生のDOMシンクに書き込むことは避けなければなりません。

Q: CSPですべてのインライン・スクリプトをブロックすべきですか？
A: デフォルトではそうです。絶対に必要な場合のみnoncesやハッシュを使用し、例外を文書化してください。長期的な目標は、インライン・スクリプトを完全に避けることです。

Q：除菌は十分ですか？
A: いいえ。 HTMLインジェストしかし、それでも正しい情報が必要です。 出力エンコーディング そして政策のガードレール。異なる問題、異なるツール。

Q: どのブラウザをテストするのですか？
A: 最低でも、ユーザーベースのトップ2つのデスクトップ＋モバイルエンジン。いくつかのベクトルは、ブラウザ固有のものであったり、フィーチャーフラグゲートされたものであったりします。

参考文献

• PortSwigger - クロスサイト・スクリプティング（XSS）チートシート - ベクター、PoC、ブラウザノートの生きたカタログ。
• OWASP - XSS対策チートシート - 厳密で文脈に特化したエンコーディング戦略と、やるかやらないかのテーブル。
• OWASP - DOMベースのXSS対策チートシート - ソース→シンクのパターンとブラウザにおける緩和策。
• PortSwigger - XSSとは何か？ - 新入社員研修のための体系的なチュートリアルと実習。

付録：サニテーションとエンコーディングのクイックリファレンス

• HTMLテキストノード → 脱出 & " ' /
• 属性値 → HTML属性のエンコード＋信頼できないデータからのイベント属性の不許可
• URL → コンポーネントをエンコードするプロトコルを許可する。 javascriptを使用しています： / のデータがある：
• JS文字列 → シリアライズ コードを解釈するAPIにユーザーデータを渡さない。

クロージング・ノート 役に立つ XSSカンニングペーパー ができるものだ。 パイプラインへの配線-巧妙なペイロードのポスターではありません。コンテキストの発見から始め、コンテキストごとにベクターをスケジュールし、ヘッドレスで再生し、ログと相関させ、信頼性スコアとともに証拠を出荷します。Penligentを採用するにしても、独自のハーネスを開発するにしても、次のような方法でプロセスを推進します。 証拠 そして政策にガードレールを守らせる。