CODEWITHSUNDEEP
androidcordovapush-notificationfirebase-cloud-messagingcordova-plugins
Miguel Q
Miguel Q

Reputation: 3618

cordova FCM push notification on background (Android)

Has anyone actually used FCM - FireBase Cloud Messaging to create device push notifications with interactive action buttons that runs when the app is is background/closed?

The goal is for the user to be able to react to the notification like WhatsApp, Messenger...

The app is cordova so anyone with experience on that would be great.

I have all the FCM setup already done and the backend working. I already can trigger a simple notification "title+body+icon/message"

According to FCM, the payload can contain the notification section, where the OS will handle the notifications, but nothing is said about it being able to contain buttons. (So it is not that interesting). However it's possible to use the "data" section with the values key pairs that are sent to the app to generate a local notification with the buttons, on the onMessage callback.

[UPDATE] The push service with data does not trigger the app to create the local notification if the app was swiped (some brands kill the app when swiped from recent apps - stopping javascript execution). Conclusion: For the FCM data payload message to work, must capture the push broadcast message event (native side) with a service, and then create the notification generation (native way) with buttons based on that data payload. FCM does not support push notifications with buttons.

import { getMessaging, getToken, onMessage } from "firebase/messaging";
import { getDevice } from "framework7/lite-bundle";

function setupPushNotification(getTokenCallBack,onMessageCallBack) {
  
  const device = getDevice();
  if (device.cordova) {
    FirebasePlugin.getToken((token) => getTokenCallBack(token));
    FirebasePlugin.onMessageReceived((message) => {
      if (message) {
        onMessageCallBack && onMessageCallBack(message);
      }
    },function(error){
      console.error(error);
    });
  }
}

And then to setup the whole process, creating a local notification object with buttons previously defined:

cordova.plugins.notification.local.addActionGroup('yes-no', [
          { id: 'yes', title: 'Yes', foreground: false },
          { id: 'no', title: 'No', foreground: false }
        ])
        
        setupPushNotification((deviceToken)=>{
          //update device token on backend database
    },
        
        (message)=>{
          //This is the onMessageReceived message
          //Create a local notification for exaple using the local notification cordova plugin
          cordova.plugins.notification.local.schedule({
            title: "Test Title",
            text: "Test Body",
            actionGroupId: 'yes-no',
          })
        
        })

I'm using these cordova plugins "cordova-plugin-local-notification": "^0.9.0-beta.2", "cordova-plugin-firebasex": "^14.2.1"

Upvotes: 0

Views: 1019

Answers (1)

Riya Singh
Riya Singh

Reputation: 314

You can do almost anything with cordova, that any native app does. Ever tried cordova-plugin-firebase-messaging? I have been able to add a chat reply text box with send button in the notifications.

you can also refer to How to add action buttons to ionic push notifications?

Upvotes: 0

Related Questions