Какие символы нужно экранировать для защиты от XSS-атак?

Основные символы для экранирования

Для защиты от XSS-атак необходимо экранировать символы, которые могут интерпретироваться браузером как HTML-теги или атрибуты. Основные символы: < (меньше), > (больше), & (амперсанд), " (двойная кавычка), ' (одинарная кавычка). Они преобразуются в HTML-сущности, чтобы браузер отображал их как текст, а не как код.

Пример экранирования

Например, пользователь вводит строку <script>alert('XSS')</script>. Без экранирования браузер выполнит скрипт. С экранированием строка станет <script>alert('XSS')</script> и отобразится как текст.

// Пример на JavaScript
function escapeHTML(str) {
  return str
    .replace(/&/g, '&')
    .replace(/</g, '&lt;')
    .replace(/>/g, '&gt;')
    .replace(/"/g, '&quot;')
    .replace(/'/g, '&#x27;');
}

const userInput = "<script>alert('XSS')</script>";
const safeOutput = escapeHTML(userInput);
document.getElementById('output').innerText = safeOutput;

Где применяется

Экранирование используется при вставке пользовательских данных в HTML-контекст (например, в innerHTML, атрибуты, URL). Важно помнить, что контекст может быть разным: HTML-теги, атрибуты, JavaScript, CSS. Для каждого контекста требуется своя стратегия экранирования. Например, для атрибутов нужно экранировать кавычки, а для JavaScript — использовать JSON.stringify.

Вывод: экранирование символов — базовая защита от XSS, но не единственная. Рекомендуется использовать готовые библиотеки (например, DOMPurify) и Content Security Policy (CSP) для комплексной безопасности.