Безопасность фронтенда ломается не в коде, а в мелочах разметки и данных

Безопасность фронтенда ломается не в коде, а в мелочах разметки и данных

Фронтенд часто считают «безопасным по умолчанию», но это ложное ощущение. Основные риски лежат в трех местах: ввод пользователя, рендер HTML и хранение токенов. Если хотя бы один из них обработан неаккуратно, уязвимость появляется без участия бэкенда.

Держите базовый чек-лист:
— Любой пользовательский текст экранируйте, не вставляйте в DOM как сырой HTML.
— Не храните access token в localStorage, если можно обойтись httpOnly-cookie.
— Любые ссылки, iframe и сторонние виджеты проверяйте на допустимые домены.
— Для форм включайте валидацию на клиенте, но не считайте ее защитой.
— Для опасных вставок используйте белые списки, а не черные.

Отдельно смотрите на зависимости. Пакетный менеджер не гарантирует безопасность: лишний npm-пакет, заброшенный плагин или вставка чужого скрипта через тег часто опаснее самой логики приложения. Минимум: фиксируйте состав сборки, убирайте неиспользуемые библиотеки, проверяйте, что реально попадает в bundle.

Вердикт для продакшена: безопасный фронтенд — это не «антивирус в браузере», а дисциплина работы с данными. Если у вас есть один стандарт экранирования, один способ подключения внешних скриптов и один ответ на вопрос, где живут токены, половина типовых проблем уже закрыта.