Ответ вслух Middle System design на фронте спрашивают часто обновлено

Аутентификация и сессии

Вопрос

Спроектируй аутентификацию во фронтенде: вход, обновление сессии, выход, несколько вкладок.

Веди разговор вслух, как на секции. Начинать с решения - главная ошибка: первые полторы минуты только вопросы.

Попробуйте сами

Ответьте вслух за 2 минуты, как на собесе. Потом сверьтесь с тезисами: что прозвучало, а что нет.

Показать ответ и разбор

Коротко

Первый вопрос - что умеет бэкенд. Кука-сессия с httpOnly, Secure, SameSite=Lax безопаснее: её нельзя прочитать из JS, значит одна XSS-дыра не означает угон сессии.

Что должно прозвучать в ответе

  • уточнил, что решает бэкенд: сессии на куках или токены

  • httpOnly-кука безопаснее токена в localStorage - назвал почему

  • обновление токена: единый перехватчик, один запрос на обновление при параллельных 401

  • очередь запросов на время обновления, чтобы не отправить пять refresh разом

  • выход из всех вкладок: событие storage или BroadcastChannel

  • защита маршрутов и что показывается, пока статус неизвестен

  • CSRF: SameSite и, при необходимости, токен

  • куда возвращать пользователя после входа

Что могут спросить следом

  • Что произойдёт, если пять запросов одновременно получат 401?
  • Где хранить токен, если бэкенд умеет только Bearer?
  • Как защититься от CSRF при куках?

Разбор

Первый вопрос - что умеет бэкенд. Кука-сессия с httpOnly, Secure, SameSite=Lax безопаснее: её нельзя прочитать из JS, значит одна XSS-дыра не означает угон сессии. Если архитектура требует токен в заголовке, короткоживущий токен доступа держим в памяти, refresh - в httpOnly-куке.

Обновление - место, где обычно баг. Пять параллельных запросов получают 401 и запускают пять обновлений; побеждает последнее, остальные ломают сессию. Лечение: единый перехватчик, один активный запрос на обновление, остальные ждут его в очереди и повторяются.

Несколько вкладок: вышел в одной - должны выйти все. Событие storage или BroadcastChannel.

Пока статус неизвестен (первая загрузка, проверка сессии) нельзя показывать ни контент, ни форму входа - иначе мигает. Нужно третье состояние.

И возврат: после входа пользователь попадает туда, куда шёл, а не на главную.

Ответьте сами, а не прочитайте

В тренажёре вопрос попадёт в повторения и вернётся, когда начнёт забываться. Плюс билеты с зачётом: 20 вопросов, не больше 2 ошибок.