Отправка push-уведомлений с использованием Firebase FCM и угловых - PullRequest
Новая
       33

Отправка push-уведомлений с использованием Firebase FCM и угловых

0 голосов
/ 11 июля 2019

Я работаю над угловым pwa, подключенным к firebase, и пытаюсь получить push-уведомление, если firebase обновляет, когда приложение не открыто. Я могу получить токен FCM, но не могу добавить и обновить его в Firebase. Поэтому у меня есть некоторые проблемы, чтобы показать сообщение.

Я уже создал firebase-messaging-sw.js и messaging-service.ts для получения токена. 

messaging-service.ts:
...
export class MessagingService {
messaging = firebase.messaging();
currentMessage = new BehaviorSubject(null);
tokensCollection: AngularFirestoreCollection<any>;
constructor(private firebasedb: AngularFirestore,   private firebaseAuth: AngularFireAuth) {}

    updateToken(token) {
      this.firebaseAuth.authState.pipe(take(1)).subscribe(() => {
        const data = { token }
        this.firebasedb.collection('fcmTokens/').valueChanges(data)
      })
    }

  getPermission() {
    this.messaging.requestPermission()
    .then(() => {
      console.log('Notification permission granted.');
      return this.messaging.getToken()
    })
    .then(token => {
      console.log(token)

      if(token)

      this.updateToken(token)
    })
    .catch((err) => {
      console.log('Unable to get permission to notify.', err);
    });
  }


  receiveMessage() {
    this.messaging.onMessage(payload => {
      console.log('Message received. ', payload);
      this.currentMessage.next(payload);
    });
  }


firebase-messaging-sw.js:
importScripts("https://www.gstatic.com/firebasejs/6.1.0/firebase-app.js");
importScripts("https://www.gstatic.com/firebasejs/6.1.0/firebase-messaging.js");

firebase.initializeApp({
  messagingSenderId: "960679172964"
});

const messaging = firebase.messaging();

messaging.setBackgroundMessageHandler(function(payload) {
  console.log('[firebase-messaging-sw.js] Received background message ', payload);
  var notificationTitle = 'TeamCalendar';
  var notificationOptions = {
      body: 'New event is available',
      icon: 'assets/icons/icon-72x72.png'
  };
  return self.registration.showNotification(notificationTitle,
  notificationOptions);
});

component.ts:
...
    this.msgService.getPermission();
    this.msgService.receiveMessage();
    this.message = this.msgService.currentMessage;
...

Я хочу получать push-уведомления, если Firebase обновляется и приложение не запускается на переднем плане.

...