Привет! Я создаю прогрессивное веб-приложение с реакцией и редукцией. Я преобразовал его в прогрессивное веб-приложение, и теперь я также сохраняю данные в indexeddb, но у меня возникают проблемы с синхронизацией автономных данных.
Я реализовал этот подход в своем компоненте приложения. Я слушаю онлайн и офлайн события браузера, затем синхронизирую автономные данные.Вот мой код.
componentWillUnmount() {
window.removeEventListener('offline',() => {
this.syncOfflineData()
});
window.removeEventListener('online',() => {
this.syncOfflineData()
});
}
syncOfflineData = () => {
console.log('a ajax request to sync offline data')
}
Функция syncOfflineData работает, но у меня возникают проблемы, например, если у меня одна и та же страница открыта в нескольких вкладках для примеров 4 вкладок, то она будетЗапустите функцию syncOfflineData 4 раза из-за 4 открытых вкладок, чтобы она добавляла одну и ту же запись 4 раза в базу данных из-за отправки запроса ajax 4 раза 1 для каждой вкладки.Я также пытался добавить уникальное значение со стороны клиента, но функция syncOfflineData запускается в то же время, когда она подключается к Интернету, так что это означает, что 4 ajax-запроса отправляются на сервер одновременно из-за того, что мойуникальные значения клиента не найдены в базе данных, поэтому он вставляет 4 одинаковые записи в базу данных.
Может кто-нибудь дать мне знать, есть ли у меня способ правильно синхронизировать, как независимо от того, сколько вкладок открыто, он отправляет только запросы, а некаждый такой же запрос для каждой новой вкладки, когда она подключается или отключается к interent.
любезно помогите мне с этим.