angular - 角火消息无法收到通知,我该如何解决这个问题?
问题描述
我无法收到通知请帮我解决问题。如果有人知道 ionic / angular web 应用程序中 firebase web 通知的更好解决方案,请帮助我。
FcmService.ts
import { Injectable } from '@angular/core';
import { AngularFireMessaging } from '@angular/fire/messaging';
import { AngularFireFunctions } from '@angular/fire/functions';
import { ToastController } from '@ionic/angular';
import { tap } from 'rxjs/operators';
// Import firebase to fix temporary bug in AngularFire
import * as app from 'firebase';
import { Observable, BehaviorSubject } from 'rxjs';
import { AngularFirestore } from '@angular/fire/firestore';
@Injectable({
providedIn: 'root'
})
export class FcmService {
token;
currentMessage = new BehaviorSubject(null);
messages$:Observable<any>;
constructor(
private db:AngularFirestore,
private afMessaging: AngularFireMessaging,
private fun: AngularFireFunctions,
private toastController: ToastController
) {
this.afMessaging.messaging.subscribe(
(_messaging) => {
_messaging.onMessage = _messaging.onMessage.bind(_messaging);
_messaging.onTokenRefresh = _messaging.onTokenRefresh.bind(_messaging);
}
)
}
getPermission() {
this.afMessaging.requestToken
.subscribe(
(token) => {
this.token = token
console.log('Permission granted! Save to the server!', token); },
(error) => { console.error(error); },
);
}
sub(topic) {
this.fun
.httpsCallable('subscribeToTopic')({ topic, token: this.token })
.pipe(tap(_ => this.makeToast(`subscribed to ${topic}`)))
.subscribe();
}
unsub(topic) {
this.fun
.httpsCallable('unsubscribeFromTopic')({ topic, token: this.token })
.pipe(tap(_ => this.makeToast(`unsubscribed from ${topic}`)))
.subscribe();
}
async makeToast(message) {
const toast = await this.toastController.create({
message,
duration: 5000,
position: 'top',
showCloseButton: true,
closeButtonText: 'dismiss'
});
toast.present();
}
updateData(data){
this.db.collection('discont').add(data)
}
receiveMessage() {
this.afMessaging.messages.subscribe(
(payload) => {
console.log("new message received. ", payload);
this.currentMessage.next(payload);
})
}
enter code here**strong text**
}
这是我调用 fcmService 的页面
主页.ts
import { FcmService } from '../services/fcm.service';
constructor(
private fcm: FcmService,
){}
ngOnInit(){
this.fcm.receiveMessage()
this.messageData = this.fcm.currentMessage
}
我已将此文件导入到“src”目录 firebase-messaging-sw.js
importScripts('https://www.gstatic.com/firebasejs/7.5.0/firebase-app.js');
importScripts('https://www.gstatic.com/firebasejs/7.5.0/firebase-messaging.js');
firebase.initializeApp({
'messagingSenderId': '884242388518'
});
const messaging = firebase.messaging();
角.json
"assets": [
"src/firebase-messaging-sw.js",
{
"glob": "**/*",
"input": "src/assets",
"output": "assets"
}
]
解决方案
Firebase 已声明消息无法通过 http 进行。如果您使用特定的 IP 地址在本地提供 Web 应用程序,您可能需要使用该标志--ssl
,否则请确保您的构建是使用 ssl 证书托管的。
检查到最后以供参考。
另外,我相信该错误已得到修复,因此您可能希望删除“错误修复”片段
// No longer needed
_messaging.onMessage = _messaging.onMessage.bind(_messaging);
_messaging.onTokenRefresh = _messaging.onTokenRefresh.bind(_messaging);
并定期处理结果。