HTMLエンティティエンコード
テキストをHTMLエンティティにエスケープし、マークアップの文字がそのまま残るようにします。ブラウザ内で処理します。
すべてブラウザ内で動作します。アップロード、記録、保存は一切行いません。
HTMLでは、5つの文字がそのまま現れるとマークアップの意味が変わってしまいます。アンパサンド、2つの山括弧、2種類の引用符です。これらをエスケープすることで、テキストの断片は、ブラウザが従うのではなく表示するテキストになります。
仕組み
最小モードはこの5文字だけをエスケープします。ほとんどの場合これが正しい選択です。ページもファイルもUTF-8なら、アクセント付きの文字はエスケープする必要がなく、エスケープするとソースが読みにくくなるだけで何も得られません。
名前付きエンティティは、HTML 4.01が名前を付けているすべての文字を置き換えます。全部で252個で、é は é、© は © になります。古いメールシステムや照合順序の誤ったデータベースのカラムのように、ASCIIを超える文字をすべて壊してしまうものを出力が通過しなければならないときに使います。
数値文字参照は、名前ではなくコードポイントで同じ保証を与えるので、名前のある252文字だけでなく、どの文字にも使えます。16進数で、閉じのセミコロンを付けて書くので、どのパーサーでも受け付けます。
例
| ケース | 入力 | 結果 |
|---|---|---|
| 実行せずに表示すべきタグ | <script>alert(1)</script> | <script>alert(1)</script> |
| 値の中のアンパサンド | Tom & Jerry | Tom & Jerry |
| 名前付きのアクセント付き文字 | café | café |
よくある質問
ここでエスケープすれば、ユーザー入力は安全になりますか？
タグの間のテキストと、引用符で囲んだ属性値については、はい。引用符もエスケープされるからです。それ以外の場所では、いいえ。URL、styleブロック、scriptブロックに入る値にはそれぞれ独自のエスケープが必要で、HTMLエンティティはその3つのどれにも適した道具ではありません。エスケープは、Webページにテキストを貼り付けて行うのではなく、自分のコードの中で、出力する時点に、その出力の文脈に合わせて行ってください。
なぜアポストロフィは ' ではなく ' にエスケープされるのですか？
' はHTML 4.01にはありません。XHTMLで、のちにHTML5で追加されたもので、古いブラウザではそのまま表示されます。数値形式はどこでも常に動作してきました。
どの名前付きエンティティに対応していますか？
HTML 4.01の252個です。HTML5はさらに約2,000個を定義していますが、ほとんどが数学記号で、ここには含めていません。この集合に名前のない文字は、名前付きモードではそのまま残し、数値モードではコードポイントでエスケープします。
最近のサイトでアクセントをエスケープする必要はありますか？
いいえ。ページがUTF-8を宣言し、ファイルがUTF-8で保存されていれば、é はただの é です。名前付きエンティティは、UTF-8をきちんと扱えないシステムにテキストを通すためのものです。
知っておきたいこと
- 処理はすべてブラウザ内で行われます。貼り付けた内容がアップロード、記録、保存されることはありません。