Sobes.tech
Middle

İki tarayıcı sekmesini localStorage kullanarak nasıl senkronize edersiniz? storage olayından bahset.

sobes.tech yapay zeka

AI'dan gelen yanıt

Для синхронизации двух вкладок браузера через localStorage используется событие storage. Оно срабатывает в других вкладках, когда в одной вкладке происходит изменение данных в localStorage.

Пример использования:

// В обеих вкладках добавляем обработчик события
window.addEventListener('storage', (event) => {
  if (event.key === 'syncKey') {
    console.log('Данные изменились:', event.newValue);
    // Здесь можно обновить состояние или выполнить нужные действия
  }
});

// В одной из вкладок обновляем localStorage
localStorage.setItem('syncKey', JSON.stringify({ time: Date.now() }));

Особенности:

  • Событие storage не срабатывает в той же вкладке, где произошло изменение, только в остальных.
  • Можно использовать для передачи сообщений между вкладками, обновления UI или синхронизации состояния.
  • Значение event.key — ключ, который изменился.
  • event.newValue и event.oldValue — новые и старые значения.

Таким образом, storage — простой и эффективный способ межвкладочной коммуникации без использования серверов или WebSocket.