Firebase Web Pu sh уведомление не работает Messaging.onMessage

Question

Я настроил веб-уведомления о pu sh для моего приложения PWA ioni c 4. Веб-уведомления pu sh работают как чудо, когда вкладка переключается, т.е. в фоновом режиме или не в моем приложении.

Проблема в том, что когда вкладка активна, я получаю pu sh обмен сообщениями в разделе приложения проверки chrome, но уведомление не отправлено.

Ниже приведен код:

app.component.ts

async ngOnInit() {
firebase.initializeApp(environment.firebase);
}

ngAfterViewInit() {
   this.platform.ready().then(async () => {
   await this.notificationsService.requestPermission();
   });
}

notifications.service.ts

export class NotificationsService {
  init(): Promise<void> {
    return new Promise<void>((resolve, reject) => {
      navigator.serviceWorker.ready.then(
    registration => {
      // Don't crash an error if messaging not supported
      if (!firebase.messaging.isSupported()) {
        resolve();
        return;
      }

      const messaging = firebase.messaging();

      // Register the Service Worker
      messaging.useServiceWorker(registration);

      // Initialize your VAPI key
      messaging.usePublicVapidKey(environment.firebase.vapidKey);


      // Listen to messages when your app is in the foreground
      messaging.onMessage(payload => {
        console.log("Payload is here", payload);
      });
      // Optional and not covered in the article
      // Handle token refresh
      messaging.onTokenRefresh(() => {
        messaging
          .getToken()
          .then((refreshedToken: string) => {
            console.log(refreshedToken);
          })
          .catch(err => {
            console.error(err);
          });
      });

      resolve();
    },
    err => {
      reject(err);
    }
  );
});
}

Поэтому, когда notificatoin запускается, если вкладка приложения открыта в chrome, следует вызвать console.log внутри messaging.onMessage но это не выполняется. Я использую FireBase версии 7.8.0 в firebase-messaging-sw.js.

Answer 1

У меня была точно такая же проблема, я действительно нашел ответ в этом посте . PWA по-прежнему имеет некоторые ограничения в отношении уведомлений pu sh.

Answer 2

Когда ваше приложение в Foreground, ваше приложение не будет получать уведомление с messaging наблюдаемым, но оно будет отправлено на messages наблюдаемом.

Так что вы должны подписать его так:

firebase.messages.subscribe((message: any) => {
        if (message.notification) {
          // Show your notification from here
        }
      });