属性 'messaging' 在使用 firebase 7.14.6 和@angular/fire 6.0.0 FCM 网络推送通知的类型 'AngularFireMessaging' 上不存在

Question

在实施 FCM 时 Background Web Notification 在我的服务中出现以下错误

error TS2339: Property 'messaging' does not exist on type 'AngularFireMessaging'

messaging.service.ts

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

@Injectable()
export class MessagingService {
    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);
             }
         )
    }
}

src/firebase-messaging-sw.js

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


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

const messaging = firebase.messaging();

已安装的软件包

"@angular/fire": "^6.0.0",
"firebase": "^7.14.6",
"@angular/cli": "^9.1.7",

我也尝试过降级 @angular/fire 和 firebase 但没有成功。

Answer 1

AngularFireMessaging不包含一个叫做messaging的属性，你需要使用属性messages:

         this.angularFireMessaging.messages.subscribe(
             (_messaging) => {
                 _messaging.onMessage = _messaging.onMessage.bind(_messaging);
                 _messaging.onTokenRefresh = _messaging.onTokenRefresh.bind(_messaging);
             }
         )
    }

https://github.com/angular/angularfire/blob/master/docs/messaging/messaging.md#subscribing-to-foreground-messages

Answer 2

我更改了@angular/fire的版本及其作品

npm i @angular/fire@5.1.1 --save

Answer 3

我试试这个，

npm i @angular/fire@5.1.1 --save

而且，也许运行时，也发现了错误 like"属性 'automaticDataCollectionEnabled' 类型缺失 'FirebaseApp'"

然后我打开文件 firebase.app.module.d.ts 像这样编辑。

export declare class FirebaseApp implements app.App {

installations(): import("firebase").installations.Installations;
performance(): import("firebase").performance.Performance;
remoteConfig(): import("firebase").remoteConfig.RemoteConfig;
analytics(): import("firebase").analytics.Analytics;
name: string;
options: {};
auth: () => FirebaseAuth;
database: (databaseURL?: string) => FirebaseDatabase;
messaging: () => FirebaseMessaging;
storage: (storageBucket?: string) => FirebaseStorage;
delete: () => Promise<void>;
firestore: () => FirebaseFirestore;
functions: (region?: string) => FirebaseFunctions;
}

Answer 4

对于错误“属性 'onMessage' 在类型 '{}' 上不存在”我只是将对象类型添加到 _messaging 现在应用程序运行:

this.angularFireMessaging.messages.subscribe(
    (_messaging: AngularFireMessaging) => {
    _messaging.onMessage = _messaging.onMessage.bind(_messaging);
    _messaging.onTokenRefresh = _messaging.onTokenRefresh.bind(_messaging);
  })
}

使用此依赖项：

"@angular/fire": "^6.0.3",
"firebase": "^7.21.0",

Answer 5

这个对我有用：

this.angularFireMessaging.messages.subscribe(
    (_messaging: AngularFireMessaging) => {
    _messaging.onMessage = _messaging.onMessage.bind(_messaging);
    _messaging.onTokenRefresh = _messaging.onTokenRefresh.bind(_messaging);
  })
}

Answer 6

试试这个它会起作用-

从“@angular/fire/compat/messaging”导入 {AngularFireMessaging}；

属性 'messaging' 在使用 firebase 7.14.6 和@angular/fire 6.0.0 FCM 网络推送通知的类型 'AngularFireMessaging' 上不存在

Property 'messaging' does not exist on type 'AngularFireMessaging' using firebase 7.14.6 and @angular/fire 6.0.0 FCM web push notification

angularjs

firebase

firebase-cloud-messaging

angularfire2