Какие символы необходимо экранировать в HTML?

251

Они такие же, как XML, возможно, плюс пробел (  )?

Я нашел несколько огромных списков экранирующих символов HTML, но я не думаю, что их нужно экранировать. Я хочу знать, что нужно избежать.

Ахмет
источник

Ответы:

318

Если вы вставляете текстовое содержимое в документ в месте, где ожидается текстовое содержимое 1 , вам обычно нужно экранировать только те же символы, что и в XML . Внутри элемента это просто включает в себя экранирующую сущность &и знаки разделителя «меньше и больше» < >:

& becomes &amp;
< becomes &lt;
> becomes &gt;

Внутри значений атрибута вы также должны экранировать символ кавычки, который вы используете:

" becomes &quot;
' becomes &#39;

В некоторых случаях может быть безопасно пропустить экранирование некоторых из этих персонажей, но я призываю вас избегать всех пяти во всех случаях, чтобы уменьшить вероятность ошибки.

Если кодировка вашего документа не поддерживает все символы, которые вы используете, например, если вы пытаетесь использовать эмодзи в документе в кодировке ASCII, вам также необходимо их избежать. Большинство документов в наши дни кодируются с использованием полностью поддерживающей Unicode кодировки UTF-8, где в этом нет необходимости.

В общем, вы не должны избегать пробелов, как &nbsp;. &nbsp;это не нормальное пространство, это неразрывное пространство . Вы можете использовать их вместо обычных пробелов, чтобы предотвратить вставку разрыва строки между двумя словами или для вставки дополнительного пробела без автоматического свертывания, но обычно это редкий случай. Не делайте этого, если у вас нет конструктивных ограничений, которые этого требуют.


1 Под «местом, где ожидается текстовое содержимое», я имею в виду значение элемента или атрибута в кавычках, где применяются обычные правила синтаксического анализа. Например: <p>HERE</p>или <p title="HERE">...</p>. То, что я написал выше , не относится к контенту, который имеет специальные правила синтаксического анализа или значение, например, внутри скрипта или тега стиля, или в качестве имени элемента или атрибута. Так , например: <NOT-HERE>...</NOT-HERE>, <script>NOT-HERE</script>, <style>NOT-HERE</script>, или <p NOT-HERE="...">...</p>.

В этих условиях правила являются более сложными, и гораздо проще внедрить уязвимость безопасности. Я настоятельно рекомендую вам никогда не вставлять динамический контент в любое из этих мест. Я видел, как команды компетентных разработчиков, осведомленных о безопасности, внедряли уязвимости, предполагая, что они правильно закодировали эти значения, но при этом пропустили крайний случай. Обычно существует более безопасная альтернатива, например, добавление динамического значения в атрибут и последующая обработка его с помощью JavaScript.

Если необходимо, ознакомьтесь с Правилами предотвращения XSS проекта Open Web Application Security, чтобы понять некоторые проблемы, которые необходимо учитывать.

Джереми Бэнкс
источник
2
Некоторые значения атрибутов HTML также могут иметь особое значение (JS / CSS). Так что это также не относится к этим, например: <p onclick="NOT-HERE">...</p>и <p style="NOT-HERE">...</p>.
Geekley
21

Это зависит от контекста. Некоторые возможные контексты в HTML:

  • тело документа
  • внутри общих атрибутов
  • внутри тегов сценария
  • теги внутри стиля
  • еще несколько!

См. Разделы «Защита от межсайтовых сценариев» OWASP , особенно разделы « Почему я не могу просто кодировать HTML-объекты ненадежными данными? » И « Правила предотвращения XSS ». Тем не менее, лучше прочитать весь документ.

daxelrod
источник
9

По сути, есть три основных символа, которые всегда должны быть экранированы в ваших файлах HTML и XML, поэтому они не взаимодействуют с остальными разметками, так что, как вы, вероятно, ожидаете, два из них будут обертками синтаксиса, которые являются < > они перечислены ниже:

 1)  &lt; (<)
    
 2)  &gt; (>)
    
 3)  &amp; (&)

Также мы можем использовать двойные кавычки (") как" и одинарные кавычки (') как & apos

Избегайте размещения динамического контента <script>и. <style>Эти правила не применяются для них. Например, если вам нужно включить JSON в a, замените <на \ x3c, символ U + 2028 на \ u2028, а U + 2029 на \ u2029 после сериализации JSON.)

Escape-символы HTML: полный список: http://www.theukwebdesigncompany.com/articles/entity-escape-characters.php

Таким образом, вам нужно экранировать <, или &, когда за ним следует что-либо, что может начинать ссылку на символ. Кроме того, правило для амперсандов является единственным таким правилом для атрибутов в кавычках, так как совпадающая кавычка - единственное, что завершает один. Но если вы не хотите завершать значение атрибута там, не используйте кавычки.

Переход на UTF-8 означает повторное сохранение вашего файла:

использование кодировки символов UTF-8 для вашей страницы означает, что вы можете избежать большинства экранирований и просто работать с символами. Однако обратите внимание, что для изменения кодировки вашего документа недостаточно просто изменить объявление кодировки в верхней части страницы или на сервере. Вам необходимо повторно сохранить документ в этой кодировке. Для получения справки о том, как сделать это с вашим приложением, прочитайте Настройка кодировки в приложениях веб-разработки.

Невидимые или неоднозначные персонажи:

Особенно полезная роль для экранирования заключается в представлении символов, которые невидимы или неоднозначны в представлении.

Одним из примеров будет символ Юникода U + 200F ПРАВАЯ К ЛЕВУЮ. Этот символ может использоваться для уточнения направленности в двунаправленном тексте (например, при использовании арабских или ивритских шрифтов). Однако он не имеет графической формы, поэтому трудно увидеть, где эти символы находятся в тексте, и если они будут потеряны или забыты, они могут привести к неожиданным результатам при последующем редактировании. Использование (или эквивалентный ему числовой символьный эквивалент) вместо этого позволяет очень легко обнаружить эти символы.

Примером неоднозначного символа является U + 00A0 NO-BREAK SPACE. Этот тип пробела предотвращает разрыв строки, но при использовании в качестве символа он выглядит как любой другой пробел. Использование делает совершенно ясным, где такие места появляются в тексте.

Алиреза
источник
3

Точный ответ зависит от контекста. Как правило, эти символы не должны присутствовать ( HTML 5.2 §3.2.4.2.5 ):

Текстовые узлы и значения атрибутов должны состоять из символов Unicode, не должны содержать символы U + 0000, не должны содержать неопределенно неопределенные символы Unicode (не символы) и не должны содержать управляющие символы, кроме пробелов. Эта спецификация включает дополнительные ограничения на точное значение узлов Text и значений атрибутов в зависимости от их точного контекста.

Для элементов в HTML ограничения модели содержимого Text также зависят от типа элемента. Например, «<» внутри элемента textarea не нужно экранировать в HTML, потому что textarea является экранируемым необработанным текстовым элементом.

Эти ограничения разбросаны по спецификации. Например, значения атрибутов ( §8.1.2.3 ) не должны содержать неоднозначный амперсанд и должны быть либо (i) пустыми, (ii) в одинарных кавычках (и, следовательно, не должны содержать символ APOSTROPHE U + 0027 '), (iii) в двойных кавычках ( не должен содержать символ U + 0022 QUOTATION MARK ") или (iv) без кавычек - со следующими ограничениями:

... не должно содержать буквенных пробелов, символов U + 0022 QUOTATION MARK ("), символов U + 0027 APOSTROPHE ('), символов U + 003D EQUALS SIGN (=), символов U + 003C LESS-THAN SIGN ( <), U + 003E символов БОЛЬШОГО ЗНАКА (>) или U + 0060 GRAVE ACCENT символов (`), и не должно быть пустой строкой.

Андрей
источник