Получить доступ

Безопасность фронтенда

Основа

XSS, CSRF, CORS, хранение токенов и Content Security Policy.

Код фронтенда открыт любому пользователю, поэтому фронтенд не может быть местом проверки прав — это делает сервер. Задача фронтенда — не открыть дыру в браузере пользователя.

Основные угрозы

  • XSS — внедрение чужого скрипта через данные. Защита: экранирование вывода (React делает это сам), осторожность с innerHTML и dangerouslySetInnerHTML, санитизация HTML (DOMPurify), CSP.
  • CSRF — чужой сайт отправляет запрос с cookies пользователя. Защита: SameSite у cookies, CSRF-токены, проверка Origin.
  • CORS — механизм, который ослабляет ограничение одного источника для доверенных доменов; ошибка CORS в консоли — это настройка сервера.

Токены и сессии

где хранитьXSSCSRF
localStorageукрадут скриптомне уязвим
cookie HttpOnly; Secure; SameSiteскрипт не прочитаетнужна защита SameSite или токеном

Чаще рекомендуют cookie с HttpOnly и короткоживущий токен доступа.

Ещё

  • Content Security Policy ограничивает источники скриптов.
  • Зависимости — регулярное обновление и аудит.
  • Не класть секреты в код фронтенда и переменные сборки.

Вопросы с собеседований

Документация

← Вся карта «Frontend-разработчик»

Закрытая бета

Знать тему — половина дела

На живом собеседовании sotto слышит вопрос интервьюера и показывает короткий ответ и план. Оставьте контакт — пришлём доступ и промокод.

  • Промокод на 2 часа — сверх пробных 30 минут
  • Программа для Windows — скачать сразу, войти — через Яндекс ID или VK ID
  • Прямая связь с разработчиком: что улучшить — сделаем