[英]Unhandled Promise rejection: this._next is not a function : Zone in @angular/fire/messaging
當我在前台接收 firebase 推送通知時,使用@angular/fire/messaging
。 方法是:
this.angularFireMessaging.messages.subscribe(
(payload) => {
console.log("new message received. ", payload);
this.currentMessage.next(payload);
})
讓我分享我的完整代碼:我編寫的PushNotificationsService 代碼。
我的 Angular-cli 版本:
Angular CLI: 8.1.3
Node: 12.4.0
OS: linux x64
Angular: 8.1.3
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Package Version
-----------------------------------------------------------
@angular-devkit/architect 0.801.3
@angular-devkit/build-angular 0.801.3
@angular-devkit/build-optimizer 0.801.3
@angular-devkit/build-webpack 0.801.3
@angular-devkit/core 8.1.3
@angular-devkit/schematics 8.1.3
@angular/fire 5.3.0
@ngtools/webpack 8.1.3
@schematics/angular 8.1.3
@schematics/update 0.801.3
rxjs 6.4.0
typescript 3.4.5
webpack 4.35.2
讓我分享我的 package.json 文件: package.json
當我在前台收到消息時出現以下錯誤:
Unhandled Promise rejection: this._next is not a function ; Zone: <root> ; Task: ServiceWorkerContainer.addEventListener:message ; Value: TypeError: "this._next is not a function"
next RxJS
messageEventListener index.esm.js:1046
step tslib.es6.js:99
verb tslib.es6.js:80
__awaiter tslib.es6.js:73
ZoneAwarePromise Angular
__awaiter tslib.es6.js:69
messageEventListener index.esm.js:1035
WindowController index.esm.js:876
Angular 5
next@http://localhost:4200/vendor.js:111323:18
./node_modules/@firebase/messaging/dist/index.esm.js/WindowController.prototype.messageEventListener/</<@http://localhost:4200/firebase-messaging.js:2418:34
step@http://localhost:4200/vendor.js:127272:23
verb/<@http://localhost:4200/vendor.js:127253:53
__awaiter/<@http://localhost:4200/vendor.js:127246:71
ZoneAwarePromise@http://localhost:4200/polyfills.js:3882:29
__awaiter@http://localhost:4200/vendor.js:127242:12
./node_modules/@firebase/messaging/dist/index.esm.js/WindowController.prototype.messageEventListener@http://localhost:4200/firebase-messaging.js:2407:71
WindowController/<@http://localhost:4200/firebase-messaging.js:2248:26
invokeTask@http://localhost:4200/polyfills.js:3397:31
runTask@http://localhost:4200/polyfills.js:3174:47
invokeTask@http://localhost:4200/polyfills.js:3471:34
invokeTask@http://localhost:4200/polyfills.js:4609:14
globalZoneAwareCallback@http://localhost:4200/polyfills.js:4635:27
任何幫助都是非常可觀的! 代碼:GITHUB 回購鏈接
我已經在 GitHub 代碼中從 firebase 更新了我的密鑰
有解決方法。
您需要稍微修改您的自定義消息服務。
在構造函數中,您需要替換以下代碼
this.angularFireMessaging.messaging.subscribe(
(_messaging: any) = > {
_messaging.onMessage = _messaging.onMessage.bind(_messaging);
messaging._next = (payload: any) = > {
console.log(payload);
};
_messaging.onTokenRefresh = _messaging.onTokenRefresh.bind(_messaging);
}
);
接着就,隨即
this.angularFireMessaging.messaging.subscribe(
(_messaging: any) = > {
// _messaging.onMessage = _messaging.onMessage.bind(_messaging);
_messaging._next = (payload: any) = > {
console.log(payload);
};
_messaging.onTokenRefresh = _messaging.onTokenRefresh.bind(_messaging);
}
);
然后,即使您處於前台,您也會收到推送通知。
試試這個版本:
"dependencies": {
...
"firebase": "^7.6.0",
"@angular/fire": "^5.2.3",
...
}
它完美地工作......
檢查此存儲庫: Angular Push Notification
是的,我意識到我在 package.json 中使用了錯誤版本的“@angular/fire”:“^5.3.0”,它與“firebase”:“^7.6.2”不兼容。
所以,我所做的——
在 firebase-messaging-sw.js 或 service worker 文件中?
importScripts('https://www.gstatic.com/firebasejs/5.0.0/firebase-app.js'); importScripts('https://www.gstatic.com/firebasejs/5.0.0/firebase-messaging.js');
應該與 package.json 上的 Firebase 具有相同的版本
"dependencies": { ... "firebase": "^5.0.0", "@angular/fire": "^5.0.0", ... }
它就像一個魅力。
解決方法在這里有詳細說明。
總之,你必須有firebase
庫版本大於7.16
的內部package.json
,它應該與版本firebase-messaging-sw.js
問題確實與Firebase的版本有關! 最后,我發現這里有詳細的解決方案。
你必須有firebase
庫版本大於7.16
的內部package.json
,它應該與版本firebase-messaging-sw.js
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.