В каких случаях рендеринг сырого HTML-контента от сервера допустим, а в каких — опасен? Как убедиться, что контент безопасен?

Когда рендеринг HTML допустим

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

Когда это опасно

Опасность возникает, когда HTML содержит данные, введенные пользователями: комментарии, сообщения, профили, загруженные файлы. Если вы вставляете такой HTML напрямую через innerHTML или dangerouslySetInnerHTML, злоумышленник может внедрить скрипт, который украдет cookies, перенаправит пользователя или изменит страницу. Это классическая XSS-атака.

Как обеспечить безопасность

Первый шаг — санитизация HTML на сервере и клиенте. Используйте библиотеки типа DOMPurify, которые удаляют опасные теги и атрибуты. Второй шаг — экранирование вывода, если вы не уверены в безопасности данных. Третий — настройка Content Security Policy (CSP), которая ограничивает выполнение скриптов. Пример на React:

import DOMPurify from 'dompurify';

const safeHTML = DOMPurify.sanitize(userContent);
return <div dangerouslySetInnerHTML={{ __html: safeHTML }} />;

На сервере (Node.js) можно использовать sanitize-html:

const sanitizeHtml = require('sanitize-html');
const clean = sanitizeHtml(dirtyHTML, { allowedTags: ['b', 'i', 'em'] });

Вывод

Используйте рендеринг сырого HTML только для доверенного контента, а для пользовательских данных всегда применяйте санитизацию и CSP. Это защитит приложение от XSS и сохранит безопасность пользователей.