Чем отличаются виды уязвимостей Frontend и где они применяются?

Виды frontend-уязвимостей: XSS, CSRF, clickjacking, небезопасное хранение токенов, инъекции, утечки данных. Различаются механизмом атаки и вектором.

Основные уязвимости и где возникают

XSS (Cross-Site Scripting)

Внедрение чужого JS через неэкранированный ввод. Где: вывод пользовательских данных без экранирования (innerHTML, dangerouslySetInnerHTML). Защита: экранирование, CSP, DOMPurify.

CSRF (Cross-Site Request Forgery)

Подделка запроса через cookie жертвы. Где: изменяющие запросы, полагающиеся только на cookie. Защита: SameSite, CSRF-токены.

Clickjacking

Обёртка сайта в невидимый iframe для обмана кликов. Где: страницы без защиты от встраивания. Защита: X-Frame-Options, frame-ancestors.

Небезопасное хранение токенов

Токены в localStorage → кража при XSS. Где: хранение секретов в доступных JS местах. Защита: память/HttpOnly cookie.

Утечка чувствительных данных

Секреты в коде/бандле, логах, URL. Защита: env-переменные, не логировать секреты.

Открытые редиректы, инъекции в URL

Небезопасная обработка параметров.

Как систематизировать

Векторы: ввод (XSS, инъекции), межсайтовые (CSRF, clickjacking), хранение (токены), транспорт (MITM → HTTPS), зависимости (уязвимые пакеты). Ориентир — OWASP Top 10.

Коротко для собеседования

Frontend-уязвимости: XSS (внедрение скрипта через неэкранированный ввод — CSP, экранирование), CSRF (подделка запроса через cookie — SameSite, токены), clickjacking (iframe-обёртка — X-Frame-Options), небезопасное хранение токенов (localStorage → память/HttpOnly), утечка секретов, инъекции в URL. Векторы: ввод, межсайтовые, хранение, транспорт, зависимости (OWASP Top 10).

Подробнее: OWASP Top 10