In my AngularJS app, I am using FCM (Firebase Cloud Messaging) to connect to Firebase and receive a messaging token. I am able to successfully retrieve the token and see messages in the console.
>>firebaseDependencies: Object { app: {…}, appConfig: {…}, installations: {…}, … }
onMessageCallback: null
swRegistration: ServiceWorkerRegistration { installing: null, scope: "http://localhost:8080/firebase-cloud-messaging-push-scope", updateViaCache: "imports", … }
vapidKey: "BHlbwdTi9t_8-FMCh2X991P_KEuIsWMoKJSWYqk44B8AtWRhoehYpZ-GkHqnSfya9ANiTMLTUZxbpK1ASIgmLBc"
<prototype>: {…}
app:
constructor: function rt(e)
deleteToken: function deleteToken()
getServiceWorkerRegistration: function getServiceWorkerRegistration()
getToken: function getToken()
logEvent: function logEvent(n, r)
messageEventListener: function messageEventListener(o)
onMessage: function onMessage(e)
onTokenRefresh: function onTokenRefresh()
requestPermission: function requestPermission()
setBackgroundMessageHandler: function setBackgroundMessageHandler()
usePublicVapidKey: function usePublicVapidKey(e)
useServiceWorker: function useServiceWorker(e)
I also have set up the following code for sending notifications:
>>https://fcm.googleapis.com/fcm/send
data
{
"to" : "dXECW-D1bx0GuaF6f-s0Ms:APA91bFjAL7-0WuqYuscLCRZJ0ojJqk1Qm8NLu21yNo8elXZy1VPzy5OGZhzRVkLTo7SSZgP9cjdx-Xq_c2jqgs2O73tYEUmfGuhflNbcq-aEVoTX4JslM1slgdQJSLvf9Kgh3X3rJQD",
>>"notification" : {
"body" : "great match!",
"title" : "Portugal vs. Denmark",
"icon" : "myicon"
}
}
However, when trying to handle incoming messages with the following code snippet, it does not work as expected:
>> messaging.onMessage().then((payload) => {
console.log('Message received. ', payload);
alert("message",payload)
// [START_EXCLUDE]
// Update the UI to include the received message.
// appendMessage(payload);
// [END_EXCLUDE]});
This issue needs further investigation to make the notification functionality work properly.