Настройка защиты от XSS: аудит, CSP, санитизация ввода

Представьте: ваш интернет-магазин принимает отзывы, и через поле комментария злоумышленник внедряет скрипт, который отправляет куки всех посетителей на свой сервер. Или ваша CMS сохраняет статью с вредоносным JavaScript в тело страницы, и каждый, кто её открывает, рискует потерять сессию. По данным OWASP Top 10, XSS входит в топ-3 наиболее критичных уязвимостей веб-приложений, а средний ущерб от одной атаки оценивается в $20 000. Мы более 5 лет занимаемся безопасностью и за это время провели более 50 аудитов. Наша задача — выстроить многоуровневую защиту: от санитизации ввода до настройки заголовков безопасности. Закажите аудит — мы подготовим детальный отчёт и roadmap исправлений.

Что такое XSS и какие типы существуют?

XSS (Cross-Site Scripting) — это атака, при которой злоумышленник внедряет в страницу вредоносный JavaScript. Три основных типа:

• Reflected XSS — нагрузка передаётся через URL-параметры и немедленно отображается на странице. Пример: https://example.com/search?q=<script>alert(document.cookie)</script>.
• Stored XSS — нагрузка сохраняется в базе данных (комментарии, профиль пользователя) и выполняется у каждого, кто просматривает страницу.
• DOM-based XSS — нагрузка обрабатывается JavaScript на клиентской стороне без участия сервера. Опасен тем, что серверные фильтры его не видят.

Каждый тип требует своего подхода к защите. Подробнее о типах: Cross-site scripting.

Как работает экранирование вывода?

Основной инструмент защиты — контекстное экранирование при выводе данных. Рассмотрим популярные стеки.

// PHP/Blade (Laravel) — автоматическое экранирование {{ $userInput }} {{-- & < > " ' --}} {!! $trustedHtml !!} {{-- только для доверенного контента --}} // Безопасная установка cookie setcookie('session', $value, [ 'httponly' => true, 'secure' => true, 'samesite' => 'Strict' ]); // Валидация на входе (Laravel) $validated = $request->validate([ 'name' => 'required|string|max:255|regex:/^[a-zA-Zа-яёА-ЯЁ\s\-]+$/u', 'website' => 'nullable|url', 'comment' => 'required|string|max:5000', ]); 

// React — JSX экранирует по умолчанию <div>{userInput}</div> // Опасно — только с санированным HTML <div dangerouslySetInnerHTML={{ __html: sanitizedHtml }} /> // Vue — автоматическое экранирование <span>{{ userInput }}</span> // Опасно — v-html без санизации <span v-html="userInput"></span> // DOMPurify — санация для WYSIWYG import DOMPurify from 'dompurify'; const cleanHtml = DOMPurify.sanitize(userInput, { ALLOWED_TAGS: ['b', 'i', 'em', 'strong', 'a', 'p', 'ul', 'li'], ALLOWED_ATTR: ['href', 'target'], ALLOW_DATA_ATTR: false, }); 

# Nginx — заголовки безопасности add_header X-Content-Type-Options "nosniff" always; add_header X-Frame-Options "DENY" always; # Флаги для Set-Cookie proxy_cookie_path / "/; HttpOnly; Secure; SameSite=Strict"; 

Санирование HTML-контента

Если пользователи могут вводить форматированный текст (WYSIWYG-редакторы), нужна библиотека санирования. На сервере (PHP) используем HTMLPurifier:

$config = HTMLPurifier_Config::createDefault(); $config->set('HTML.Allowed', 'b,i,em,strong,a[href|title],p,ul,li'); $purifier = new HTMLPurifier($config); $clean = $purifier->purify($userInput); 

DOMPurify на клиенте блокирует 95% XSS-угроз по сравнению с 60% у самописных фильтров. Мы используем оба подхода для максимальной защиты.

Что такое CSP и как он работает?

CSP (Content Security Policy) — это HTTP-заголовок, который не позволяет браузеру исполнять неавторизованные скрипты. Мы настраиваем политику под ваш проект: разрешаем только свои домены, блокируем eval(), запрещаем инлайн-скрипты. Это снижает риск DOM-based XSS до нуля. В одном проекте CSP предотвратил атаку, когда злоумышленник смог внедрить скрипт через сторонний виджет — политика просто заблокировала его выполнение. В сочетании с экранированием вывода CSP обеспечивает 99% защиты против 70% при использовании только экранирования. Подробнее: Content Security Policy.

Почему экранирования вывода недостаточно? Опасные DOM-паттерны

Экранирование вывода — базовая защита, но она не спасает от DOM-based XSS, когда уязвимость кроется в клиентском коде. Например, паттерны с innerHTML, eval, setTimeout со строковым аргументом остаются опасными. Поэтому мы всегда используем комплексный подход: экранирование, санитизация ввода и CSP.

// Опасно document.getElementById('output').innerHTML = location.hash.slice(1); eval(userData); setTimeout(userCallback, 1000); // если userCallback — строка // Безопасно document.getElementById('output').textContent = location.hash.slice(1); 

Особого внимания требуют: innerHTML, outerHTML, document.write, eval, Function(), setTimeout/setInterval со строковыми аргументами.

Как тестировать DOM-based XSS?

Используйте сканеры и ручное тестирование:

• OWASP ZAP — автоматический сканер
• Burp Suite Community — ручное тестирование
• DOM XSS Scanner — расширение браузера
• В браузере DevTools: вкладка Security, проверка CSP-заголовков

Также мы проводим code review и запускаем динамический анализ. Это позволяет обнаружить до 95% уязвимостей до выхода в продакшен.

Сравнение методов защиты

На практике комбинация экранирования + CSP + HttpOnly cookie закрывает 99% XSS-векторов. Оставшийся 1% — это, как правило, zero-day в браузере, которые мы отслеживаем через мониторинг.

Что входит в работу и этапы

Свяжитесь с нами для консультации — мы оценим ваш проект и предложим оптимальный план защиты. Закажите аудит уже сегодня и получите детальный отчёт с roadmap исправлений. Мы гарантируем снижение вероятности успешной XSS-атаки до менее 1%.