Техпрогон
ВойтиНачать бесплатно
Выбор ответа Middle Безопасность фронтенда обновлено

Что не так с обработчиком postMessage

Вопрос

Что опасно в этом обработчике?

window.addEventListener('message', (e) => {
  if (e.data.type === 'setToken') {
    localStorage.setItem('token', e.data.token);
  }
});

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

Выберите вариант, и откроется разбор.

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

Коротко

Правильный ответ: Не проверяется e.origin: любое окно с доступом к странице подменит токен. Сообщения может прислать любое окно, у которого есть ссылка на ваше: родитель iframe, открывшая вкладка.

Варианты ответа

  1. Не проверяется e.origin: любое окно с доступом к странице подменит токенправильный ответ
  2. localStorage нельзя вызывать внутри обработчика событий, запись не сохранится
  3. Событие message не всплывает до window, поэтому обработчик не сработает
  4. Нужно читать e.detail вместо e.data, иначе придёт undefined

Разбор

Сообщения может прислать любое окно, у которого есть ссылка на ваше: родитель iframe, открывшая вкладка. Без проверки e.origin по белому списку злоумышленник подставит свой токен. localStorage доступен в любом обработчике. Событие message приходит прямо на window, всплытие тут ни при чём. detail бывает у CustomEvent, у MessageEvent данные в data.

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

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

Потренироваться бесплатно

Предыдущий вопрос

Что такое один origin

Следующий вопрос

Где React не спасает от XSS

Урок по теме

Безопасность фронтенда: XSS, CSRF, CSP

Термины по теме

Content Security PolicyCSRFXSS

Ещё по теме «Безопасность фронтенда»

Все вопросы модуля