Передача данных между вкладками браузера

Задача

Синхронизировать информацию об авторизации пользователя между разными вкладками. Иными словами, на одной вкладке пользователь зашел под админом, а на другой зашел с правами обычного пользователя.

Соответственно, на той вкладке, где он под админом, страничка должна либо перезагрузиться (чтобы получить полностью обновленные данные), либо направить пользователя на страницу авторизации.

Решение

Сначала хотел использовать веб-сокеты, но по техническим причинам от этого варианта пришлось отказаться. Итак, в первой реализации я завел переменную в localStorage, значение которую проверял каждые две секунды с помощью setInterval.

Затем в одной статейке прочитал, что у window есть событие storage, которое происходит в момент добавления, изменения, или удаления элемента из localStorage (или sessionStorage).

Класс, теперь можно отказаться от setInterval, и написать более компактный и стабильный код!

Пример подписки на событие:

window.addEventListener('storage', function (event) {
  console.log(event.key, event.newValue);
});

Про событие «storage» на MDN
Статья про взаимодействие между вкладками

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Этот сайт использует Akismet для борьбы со спамом. Узнайте как обрабатываются ваши данные комментариев.