Кодирование и декодирование HTML-сущностей
Экранируйте символы, которые HTML воспринимает как разметку, а при желании и все символы вне ASCII, или превращайте сущности вроде é и — обратно в обычный текст. Оба направления работают в вашем браузере, а декодированный ввод никогда не отображается как живой HTML.
Символов: 0 · слов: 0 · строк: 0
Символов: 0 · слов: 0 · строк: 0
Всё работает в этой вкладке браузера. Ваш текст никуда не загружается и не сохраняется.
Распространённые символы и их сущности
Именованная, десятичная и шестнадцатеричная формы декодируются в один и тот же символ. Кодировщик знает 216 распространённых именованных сущностей; декодер понимает все именованные ссылки из стандарта HTML.
| Символ | Именованные | Десятичные | Шестнадцатеричные |
|---|---|---|---|
& | & | & | & |
< | < | < | < |
> | > | > | > |
" | " | " | " |
' | ' | ' | ' |
(неразрывный пробел) | |   |   |
© | © | © | © |
® | ® | ® | ® |
™ | ™ | ™ | ™ |
€ | € | € | € |
£ | £ | £ | £ |
¥ | ¥ | ¥ | ¥ |
— | — | — | — |
– | – | – | – |
… | … | … | … |
« | « | « | « |
» | » | » | » |
° | ° | ° | ° |
× | × | × | × |
÷ | ÷ | ÷ | ÷ |
é | é | é | é |
π | π | π | π |
→ | → | → | → |
😀 | — | 😀 | 😀 |
От 252 сущностей в HTML 4 до 2 231 в HTML5
Символьная ссылка позволяет записать любой символ с помощью одного лишь ASCII. Числовые ссылки подходят для любой кодовой точки Unicode, в десятичной (é) или шестнадцатеричной (é) записи. Именованные ссылки запомнить проще: в HTML 4 их определено 252, среди них буквы Latin-1 вроде é, греческие буквы, математические символы и типографские знаки, например — и …. Любопытно, что ' в этот список не входил: он пришёл из XML и стал допустимым в HTML только с HTML5.
В HTML5 список расширили до 2 231 именованной символьной ссылки, включив набор сущностей MathML, поэтому имена вроде ✓, ★ и ≂̸ теперь работают во всех современных браузерах. В это число входят устаревшие написания без закрывающей точки с запятой, например & и ©: парсеры принимают их ради совместимости, но писать так не следует. Кодировщик здесь использует широко поддерживаемые имена из HTML 4 плюс ', а для всех остальных символов подставляет числовую ссылку; декодер передаёт текст встроенному парсеру браузера, поэтому понимает все 2 231 имя.
Что экранировать и когда экранирования недостаточно
Вариант Only & < > " ' подходит для повседневной работы: он экранирует пять символов, которые могут завершить текстовый узел или значение атрибута в кавычках. Этого достаточно, чтобы показать пример кода на странице или безопасно вставить пользовательский текст в HTML. Вариант Also every non-ASCII character превращает в ссылки также é, € и эмодзи — для редких каналов, которые не передают UTF-8, например некоторых старых шаблонов писем или систем, портящих кодировку. Варианты Named, Decimal и Hex меняют только способ записи ссылки; все три декодируются в один и тот же символ. Странице в UTF-8 сущности для букв с диакритикой не нужны.
Экранирование защищает только контекст HTML. Текст, вставляемый в блок script, встроенный обработчик события вроде onclick, атрибут style или href, который может начинаться с javascript:, требует другой обработки, и одного кодирования сущностей там недостаточно для защиты от межсайтового скриптинга. Фреймворки вроде React экранируют текст по умолчанию, поэтому в современных приложениях чаще встречается двойное экранирование: пользователи видят & там, где должен быть амперсанд. Чтобы полностью убрать теги, преобразуйте разметку с помощью HTML в TXT; для экранирования внутри URL используйте кодирование и декодирование URL.
Часто задаваемые вопросы
- Какие символы обязательно экранировать в HTML?
- В тексте обязательны & и <, а > экранируют по соглашению. В значении атрибута нужно также экранировать кавычку, которой оно ограничено. Экранирование всех пяти символов подходит для обоих случаев.
- Чем отличается от обычного пробела?
— неразрывный пробел, U+00A0. Он выглядит как пробел, но не допускает переноса строки в этом месте и, в отличие от обычных пробелов в HTML, не схлопывается, если их несколько подряд.- Почему на странице отображается & вместо амперсанда?
- Текст был экранирован дважды: один раз в ваших данных и ещё раз шаблоном или фреймворком. Храните исходный текст и поручите экранирование одному слою, обычно шаблону, при выводе.
- Безопасно ли декодировать здесь HTML из ненадежного источника?
- Да. Декодер разбирает ввод как обычный текст, поэтому теги не создаются, скрипты не выполняются, изображения не загружаются. В символы превращаются только символьные ссылки.
- Что лучше: именованные или числовые сущности?
- Именованные проще читать, а числовые работают для любого символа и в любом XML-парсере. В XML без DTD предопределены только
&,<,>,"и'.