firebase.messaging 不是 Angular 中的函数 9

Question

我逐行学习了本教程： https://medium.com/mighty-ghost-hack/angular-8-firebase-cloud-messaging-push-notifications-cc80d9b36f82

如何简单地将通知网站放入我的 Angular 9 项目，在我的 Angular CLI 中我输入：

    "assets": [
      "src/favicon.ico",
      "src/assets",
      "src/firebase-messaging-sw.js",
      "src/manifest.json"
    ],

这是我的 firebase-messagin-sw.js

importScripts('https://www.gstatic.com/firebasejs/7.6.0/firebase-app.js');
importScripts('https://www.gstatic.com/firebasejs/7.6.0/firebase-analytics.js');

firebase.initializeApp({
  apiKey: ******************,
  authDomain: ******************,
  databaseURL: ******************,
  projectId: ******************,
  storageBucket: ******************,
  messagingSenderId: ******************,
  appId: ******************,
  measurementId: ******************
});
console.log(firebase);
const messaging = firebase.messaging();

这个文件在我的根项目和我创建的通知服务中：

import { Injectable } from '@angular/core';
import { AngularFireMessaging } from '@angular/fire/messaging';
import { BehaviorSubject } from 'rxjs';


@Injectable()
export class NotificationService {

  currentMessage = new BehaviorSubject(null);

  constructor(private angularFireMessaging: AngularFireMessaging) {
    this.angularFireMessaging.messaging.subscribe((_messaging) => {
      _messaging.onMessage = _messaging.onMessage.bind(_messaging);
      _messaging.onTokenRefresh = _messaging.onTokenRefresh.bind(_messaging);
    });
  }
  requestPermission() {
    this.angularFireMessaging.requestToken.subscribe(
      (token) => {
        console.log(token);
      },
      (err) => {
        console.error('Unable to get permission to notify.', err);
      }
    );
  }
  receiveMessage() {
    this.angularFireMessaging.messages.subscribe((payload) => {
      console.log('new message received. ', payload);
      this.currentMessage.next(payload);
    });
  }
}

加载我的应用程序时出现此错误：Uncaught TypeError: firebase.messaging is not a function，就像 Angular CLI 未加载 js文件但是当我使用这个 console.log(firebase) 它给了我一个没有这个功能的 javascript 对象并且在这个错误之后：

我收到另一个错误：TypeError：无法为范围更新 ServiceWorker ('http://localhost:4200/firebase-cloud-messaging-push-scope')

我做错了什么？

Answer 1

据我了解你的问题，我想回答一下。
我想你也可以在你的 firebase-messagin-sw.js.

上添加这个

importScripts('https://www.gstatic.com/firebasejs/7.18.0/firebase-messaging.js');

为了使用云消息传递的最佳体验，还添加了 Firebase SDK for Analytics。

importScripts('https://www.gstatic.com/firebasejs/7.18.0/firebase-analytics.js');

进一步参考：https://firebase.google.com/docs/web/setup#expandable-8

firebase.messaging 不是 Angular 中的函数 9

firebase.messaging is not a function in Angular 9

firebase

firebase-cloud-messaging

angular