HTMLサニタイザー設定ビルダーとは
HTMLサニタイザーはユーザーが送信した文字列から危険なHTMLタグ、属性、コンテンツを削除してからページ上でレンダリングします。これにより攻撃者がコメントフィールド、リッチテキストエディター、またはユーザー入力領域を通じて悪意のあるスクリプトを注入するXSS(クロスサイトスクリプティング)攻撃を防ぎます。ブラウザのSanitizer APIはネイティブのサニタイズを提供しDOMPurifyは同じ目的で最も広く使用されているJavaScriptライブラリです。
クイックアンサー
ユーザー送信HTMLをレンダリングする際のXSSを防ぐためにHTMLサニタイザーの許可リストを構築します。コンテンツタイプのプリセット(コメント、ブログ、リッチテキスト)を使用するか許可するタグと属性をカスタマイズします。ネイティブのSanitizer API、DOMPurify、または両方の設定を出力します。常にscriptタグ、イベントハンドラー、javascript: URLをブロックします。
Last updated: 2026-05-28
制限事項
- 完璧なサニタイザーはありません。新しい攻撃ベクトルが定期的に発見されています。DOMPurifyまたはサニタイズ戦略を最新の状態に保ちセキュリティアドバイザリを購読してください。
- ネイティブのSanitizer APIは2025年現在Safariではサポートされていません。クロスブラウザサポートにはDOMPurifyを使用するかフォールバック戦略を実装してください。
- サニタイズはXSSを防ぎますがフィッシング、コンテンツスプーフィング、レイアウト崩れは防ぎません。ユーザー送信コンテンツには追加の検証とコンテンツモデレーションが必要になる場合があります。
Sources:MDN Web Docs · W3C Specifications · jquery.app on GitHub
使い方
- ユーザーが送信すると予想されるHTMLの種類に基づいてコンテンツタイプのプリセットを選択します。
- 特定のユースケースに合わせて許可するタグと属性を確認しカスタマイズします。
- 出力形式を選択します:Sanitizer API、DOMPurify、または両方。
- 設定をコピーしてユーザー送信HTMLをレンダリングする場所で使用します。
主な用途
- 基本的な書式設定(太字、斜体、リンク)を許可するがスクリプトや複雑なマークアップをブロックするブログコメントセクション用のHTMLサニタイザーを設定します。
- 編集者が見出し、リスト、テーブル、画像を使用できるがスクリプトやiframeを埋め込めないリッチテキストCMS用のサニタイザー設定を構築します。
- ユーザー投稿のMarkdownをHTMLに変換してレンダリングする静的サイト用のDOMPurify設定をセットアップします。