Какие способы общения между вкладками кроме localStorage существуют

Что проверяют

Знаете ли вы браузерные API для связи вкладок одного источника и их ограничения. Следом часто дают практическую задачу: разлогинить все вкладки разом или сделать так, чтобы соединение с сервером держала только одна вкладка.

Как отвечать

Основной ответ сегодня BroadcastChannel, остальное по ситуации:

• BroadcastChannel: new BroadcastChannel("auth"), postMessage и onmessage. Рассылает вкладкам, iframe и воркерам того же источника, передаёт объекты через structured clone. Есть во всех актуальных браузерах, в Safari с версии 15.4;
• SharedWorker: один воркер на все вкладки источника, общение через port. Удобно держать в нём единственное соединение с сервером. На мобильных браузерах поддержка исторически хромает, сверяйтесь с caniuse;
• Service Worker: вкладка шлёт сообщение воркеру, тот рассылает всем через clients.matchAll() и client.postMessage. Оправдан, если воркер уже есть;
• window.postMessage: для окон, у которых есть ссылка друг на друга, например через window.open. Работает и между разными источниками, если проверять event.origin;
• Web Locks API (navigator.locks.request): не канал, а выбор лидера. Вкладка с блокировкой держит соединение, при её закрытии блокировку забирает следующая;
• IndexedDB: общее хранилище без событий об изменениях, поэтому его дополняют BroadcastChannel как сигналом;
• через сервер: WebSocket или SSE в каждой вкладке, когда синхронизировать нужно ещё и устройства.

Типичная связка для «выйти везде»: при логауте отправить событие в BroadcastChannel, остальные вкладки чистят состояние и уходят на страницу входа.

Где спотыкаются

Называют window.name. Это свойство конкретного окна, другие вкладки его не видят, а браузеры ещё и сбрасывают его при переходе на другой сайт.

Ждут, что BroadcastChannel доставит сообщение отправителю. Отправившая вкладка его не получает, своё состояние она обновляет сама.

Забывают про границы: всё работает только в пределах источника, а в сторонних iframe каналы и хранилища дополнительно разделяются по сайту верхнего уровня.