如何修复错误：未处理的承诺拒绝：this._next 不是函数；区域： <root> ; 任务：ServiceWorkerContainer.addEventListener:message

Question

当我在前台收到 firebase 推送通知时会发生此错误。请注意，推送通知在后台运行良好（即当浏览器最小化或关闭时）。我已经安装了最新版本的@angular/fire@6.0.0 和 firebase@7.13.2。我不确定这是 firebase 还是 @angular/fire 的问题，还是我需要向 plyfills.ts 添加一些代码

接收通知的方法

receiveMessage() {
    this.ngFireMessaging.messages.subscribe(
      (message: any) => {
        console.log(message);
        this.currentMessage$.next(message);
      });
  }

Angular CLI 版本

Angular CLI: 9.1.0
Node: 12.16.0
OS: win32 x64

Angular: 9.1.0
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router, service-worker
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.900.7
@angular-devkit/build-angular     0.901.0
@angular-devkit/build-optimizer   0.901.0
@angular-devkit/build-webpack     0.901.0
@angular-devkit/core              9.1.0
@angular-devkit/schematics        9.1.0
@angular/cdk                      9.2.0
@angular/fire                     6.0.0
@angular/material                 9.2.0
@ngtools/webpack                  9.1.0
@schematics/angular               9.1.0
@schematics/update                0.901.0
rxjs                              6.5.5
typescript                        3.8.3
webpack                           4.42.0

来自控制台的错误

Unhandled Promise rejection: this._next is not a function ; Zone: <root> ; Task: ServiceWorkerContainer.addEventListener:message ; Value: TypeError: this._next is not a function
    at e.next [as onMessageCallback] (main.2ac4bad4d06fe2a505d3.js:1)
    at e.<anonymous> (firebase-messaging.c990cfcb6700c33953d8.js:1)
    at main.2ac4bad4d06fe2a505d3.js:1
    at Object.next (main.2ac4bad4d06fe2a505d3.js:1)
    at main.2ac4bad4d06fe2a505d3.js:1
    at new e (polyfills.4543e63cd9f44e11348e.js:1)
    at l (main.2ac4bad4d06fe2a505d3.js:1)
    at e.messageEventListener (firebase-messaging.c990cfcb6700c33953d8.js:1)
    at ServiceWorkerContainer.<anonymous> (firebase-messaging.c990cfcb6700c33953d8.js:1)
    at e.invokeTask (polyfills.4543e63cd9f44e11348e.js:1) TypeError: this._next is not a function
    at e.next [as onMessageCallback] (https://internetbanking-a.firebaseapp.com/main.2ac4bad4d06fe2a505d3.js:1:193372)
    at e.<anonymous> (https://internetbanking-a.firebaseapp.com/firebase-messaging.c990cfcb6700c33953d8.js:1:26524)
    at https://internetbanking-a.firebaseapp.com/main.2ac4bad4d06fe2a505d3.js:1:427790
    at Object.next (https://internetbanking-a.firebaseapp.com/main.2ac4bad4d06fe2a505d3.js:1:427895)
    at https://internetbanking-a.firebaseapp.com/main.2ac4bad4d06fe2a505d3.js:1:426832
    at new e (https://internetbanking-a.firebaseapp.com/polyfills.4543e63cd9f44e11348e.js:1:14960)
    at l (https://internetbanking-a.firebaseapp.com/main.2ac4bad4d06fe2a505d3.js:1:426577)
    at e.messageEventListener (https://internetbanking-a.firebaseapp.com/firebase-messaging.c990cfcb6700c33953d8.js:1:26245)
    at ServiceWorkerContainer.<anonymous> (https://internetbanking-a.firebaseapp.com/firebase-messaging.c990cfcb6700c33953d8.js:1:23473)
    at e.invokeTask (https://internetbanking-a.firebaseapp.com/polyfills.4543e63cd9f44e11348e.js:1:8398)
Zone.__load_patch.n.onUnhandledError @ polyfills.4543e63cd9f44e11348e.js:1
(anonymous) @ polyfills.4543e63cd9f44e11348e.js:1
e @ polyfills.4543e63cd9f44e11348e.js:1
Zone.__load_patch.n.microtaskDrainDone @ polyfills.4543e63cd9f44e11348e.js:1
b @ polyfills.4543e63cd9f44e11348e.js:1
t.invokeTask @ polyfills.4543e63cd9f44e11348e.js:1
p @ polyfills.4543e63cd9f44e11348e.js:1
h @ polyfills.4543e63cd9f44e11348e.js:1

我已经阅读了 firebase 和 @angular/fire 文档，但没有得到任何帮助。

我希望这对任何可以提供帮助的人来说都是足够的信息。

Answer 1

我在这上面花了很多时间！最后我发现这里有详细的解决方案。

总之，您的firebase库版本必须大于7.16您的库版本package.json，并且它应该与中的版本匹配firebase-messaging-sw.js