我有一个Angular 5和Firebase 4.10应用程序,它可以监听Firebase数据库中的更改并相应地触发通知 . 每当在Firebase中创建新通知时,如 { "body": "some body", "title": "some title" }index.js 中的 onCreate 函数将向用户的设备发送其FCM令牌和相应的有效负载:

const functions = require('firebase-functions');
const admin = require("firebase-admin");
admin.initializeApp();

exports.fcmSend = functions.database.ref('/messages/{userId}/{messageId}').onCreate((snapshot, context) => {

  const message = snapshot.val();
  const userId  = 'user';

  const payload = {
        notification: {
          title: message.title,
          body: message.body,
          icon: 'favicon.ico'
        }
      };

   admin.database()
        .ref(`/fcmTokens/${userId}`)
        .once('value')
        .then(token => token.val() )
        .then(userFcmToken => {
          return admin.messaging().sendToDevice(userFcmToken, payload)
        })
        .then(res => {
          console.log("Sent Successfully", res);
          return 'Success!';
        })
        .catch(err => {
          console.log(err);
        });
});

以下是 firebase-messaging-sw.js 文件:

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

firebase.initializeApp({
    apiKey: '...',
    authDomain: '...',
    databaseURL: '...',
    projectId: '...',
    storageBucket: '...',
    messagingSenderId: '...'
});

const messaging = firebase.messaging();

以下是Angular 5服务:

import { Injectable } from '@angular/core';
import { AngularFireDatabase } from 'angularfire2/database';
import { AngularFireAuth } from 'angularfire2/auth';
import * as firebase from 'firebase/app';
import '@firebase/messaging';
import 'rxjs/add/operator/take';
import { BehaviorSubject } from 'rxjs/BehaviorSubject';

@Injectable()
export class FirebaseService {

  messaging = firebase.messaging();
  currentMessage = new BehaviorSubject(null);

  constructor(private db: AngularFireDatabase, private afAuth: AngularFireAuth) { }

  private updateToken(token) {
    this.afAuth.authState.take(1).subscribe(user => {
      if (!user) {
        return;
      } else {
        const data = { [ user.uid ]: token };
        this.db.object('fcmTokens/').update(data);
      }
    });
  }

  getPermission () {
    this.messaging.requestPermission()
    .then(() => {
      return this.messaging.getToken();
    })
    .then(token => {
      this.updateToken(token);
    })
    .catch((error) => {
      console.log('Unable to get permission to notify!', error);
    });
  }

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

}

我有以下问题:

  • 以上系统适用于在Firefox中向用户发送通知,但仅当应用程序不是当前选项卡或关闭时(浏览器在桌面上打开) . 如果应用程序是当前选项卡,我可以从控制台看到有效负载已发送但未触发通知 .

  • 无论应用是打开还是关闭,Chrome都无法收到任何通知 . 控制台中没有错误或警告 .