Yueseryueser.com

← ガイド一覧

HTML エンティティ変換のガイド:コードを実行させずに見せる

目的は内容を安全にすることではなく、内容を文字として表示することです。この2つを混同したところで事故が起きます。

ツールを開く:HTMLエンティティエンコーダー

エスケープが必要な場面

ブログにクラス属性付きの div タグをそのまま貼ると、ブラウザは本物のタグとして扱い、四角だけが表示されてコードは消えます。山かっこを実体参照にすれば、文字として見えます。

テンプレートで利用者の入力を表示する場合、HTML メールを部品から組み立てる場合、リッチテキストエディタの結果を静的ページに埋め込む場合も同じです。見せるべき内容を、実行させないようにします。

5文字と、その順番

変換が必要なのは5文字だけです。アンパサンドは &、小なりは <、大なりは >、二重引用符は "、単一引用符は ' になります。アンパサンドを最初に処理しないと、生成した実体参照がさらに変換されて二重になります。

属性値は必ず引用符で囲んでください。引用符のない title 属性は避けます。単一引用符も変換されるため、単一引用符で囲んだ属性も壊れません。中国語や絵文字はそのまま残り、出力は読みやすいままです。

境界:エスケープは XSS 対策ではない

XSS 対策は文脈ごとのエスケープが必要です。HTML 本文、属性、JavaScript 文字列、CSS、URL では規則が異なり、HTML エンティティの一回の変換ではすべての注入を防げません。防線はサーバ側のテンプレートと CSP にあります。

暗号でもありません。対応表は公開されていて誰でも戻せます。メールアドレスや鍵を隠す用途には使えず、コピーの手間が増えるだけです。信頼できない入力は、表示前に許可リスト方式で無害化してください。

よくある質問

なぜ5文字だけなのですか

HTML で構文上の意味を持つのはこの5文字だけです。アンパサンドは実体参照の開始、山かっこはタグの区切り、引用符は属性値の区切りを表します。中国語を含め、それ以外は変換不要です。

変換すれば XSS は防げますか

防げません。この変換は文字として表示するだけで、JavaScript の文脈や URL パラメータ、CSS は対象外です。サーバ側で出力位置ごとに対策し、CSP と入力検証を組み合わせてください。

中国語や絵文字も変換すべきですか

不要です。現代のページは UTF-8 なので、そのまま書くほうが読みやすく、ツールも残します。出力を純粋な ASCII にする必要がある場合だけ、数値文字参照を検討してください。

関連ツール:HTMLエンティティエンコーダー