Как это работает сейчас:
- запрашиваю у пользователя разрешение на показ уведомлений через Notification.requestPermission()
- если разрешение получено, то регистрируется Service Worker из файла /sw.js (navigator.serviceWorker.register("/sw.js"))
- после успешной регистрации Service Worker вызывается subscribeToPushNotifications(), где проверяется, поддерживается ли PushManager, получается текущая подписка на push (pushManager.getSubscription()), если подписки нет, создаётся новая подписка с помощью pushManager.subscribe(), используя VAPID ключ (applicationServerKey).
- проверяю есть ли разрешение на уведомления. потом пытаюсь отправить сообщение Service Worker через navigator.serviceWorker.controller.postMessage() с типом "SHOW_NOTIFICATION" и параметрами уведомления.
если контроллера нет, но есть объект регистрации serviceWorkerRegistration, вызывается метод showNotification() у Service Worker.
если не сработало, создаётся уведомление через конструктор Notification напрямую.
в Service Worker есть слушатель сообщений self.addEventListener("message")
Когда приходит сообщение "SHOW_NOTIFICATION", вызывается self.registration.showNotification(title, options), чтобы показать уведомление.
В RatingStore есть метод registerPeriodicSync(), который пытается зарегистрировать фоновую задачу Periodic Sync с тегом "check-rating" (если поддерживается браузером).
в Service Worker есть слушатель "periodicsync" с обработкой тега "check-rating". Когда срабатывает, SW посылает всем клиентам сообщение с типом "CHECK_RATING".
в RatingStore добавлен слушатель сообщений от Service Worker:
navigator.serviceWorker.addEventListener("message", async (event) => {
if (event.data.type === "CHECK_RATING") {
await this.checkRatingChange(intl);
}
});
метод checkRatingChange() делает запросы рейтинга, сравнивает текущие и предыдущие значения, вызывает ratingNotificationStore.calculateRatingChanges() и затем sendRatingChangeNotification() для формирования и отправки push-уведомлений.
Уведомления приходят в pwa на компьютере и в активной вкладке и во вкладке которая не в фокусе но открыта
но
На телефоне они приходят только при активном pwa приложении если его свернуть, то больше ничего не приходит
Чего мне не хватает для полной корректной работы? Что я сделала не так?
Я видела информацию что пока приложение не активно postMessage которым я доставляю data в sw не работает. Но текст уведомления вычисляется на основе данных которые я запрашивала с сервера в клиенте а потом считала и в зависимости от результата выводилось смс, так же присутствует локализация поэтому поместить это всё в sw без postMessage я способа не вижу. Можно ли реализовать то что я хочу без бекенда?
Средний
