phonegap-plugin-push on("notification") event is not firing when app is in background

Question

I am using following plugin for push notification in Ionic2

http://ionicframework.com/docs/native/push/

Expected Behaviour: When app is closed, And notification received, And when user tap the notification, on("notification") event should fire after app opens.

Actual Behaviour: I am getting notification successfully. But When Application is in background or closed, at that time when I receive notification and I tap the notification, on("notification") event is not firing.

Cordova version 7.0.1 Android version 6.2.3

My code:

this.platform.ready().then(() => {
    this.pushsetup();
});

private pushOptions: PushOptions;
private pushObject: PushObject;
pushsetup() {
    // to check if we have permission
    this.push.hasPermission()
        .then((res: any) => {
            if (res.isEnabled) {
                console.log('We have permission to send push notifications');
                // configuration of push notification
                this.pushOptions = {
                    android: {
                        senderID: 'XXXXXXXXXXX',
                        icon: 'icon_notification'
                    },
                    ios: {
                        alert: 'true',
                        badge: true,
                        sound: 'false',
                        senderID: 'XXXXXXXXXXX'
                    },
                    windows: {}
                };
                this.pushObject = this.push.init(this.pushOptions);

                // attach push events
                this.storage.get('isPushRegistered')
                    .then(isPushRegistered => {
                        if( !isPushRegistered ){
                            this.pushObject.on('registration').subscribe((registration: any) => {
                                console.log('Device registered', registration)
                                this.storage.set('isPushRegistered', true)
                            });
                        }
                    })


                this.pushObject.on('notification').subscribe((notification: any) => {
                    console.log('Received a notification', notification)
                });
                this.pushObject.on('error').subscribe(error => console.error('Error with Push plugin', error));
            }
        });
}

So, on my code, you can see this.pushObject.on('notification') event. that is not firing when app is closed.

Thank you for your time and support.

Answer 1

This is not the issue with client side code. This issue is occuring because of the notification payload.

From Official docs of phonegap-plugin-push

Notifications behave differently depending on the foreground/background state of the receiving app and the payload you send to the app.

For instance if you send the following payload: phonegap-plugin-push/

{
  "notification": {
    "title": "Test Notification",
    "body": "This offer expires at 11:30 or whatever",
    "notId": 10
  }
}

When your app is in the foreground, any on('notification') handlers you have registered will be called. However, if your app is in the background, the notification will show up in the system tray. Clicking on the notification in the system tray will start the app but your on('notification') handler will not be called as messages that have notification payloads will not cause the plugins onMessageReceived method to be called.

If you send a payload with a mix of notification & data objects like this:

{
    "notification": {
        "title": "Test Notification",
        "body": "This offer expires at 11:30 or whatever",
        "notId": 10
    },
    "data" : {
        "surveyID": "ewtawgreg-gragrag-rgarhthgbad"
    }
}

When your app is in the foreground any on('notification') handlers you have registered will be called. If your app is in the background, the notification will show up in the system tray. Clicking on the notification in the system tray will start the app and your on('notification') handler will not be called as messages that have notification payloads will not cause the plugins onMessageReceived method to be called.

My recommended format for your push payload when using this plugin (while it differs from Google's docs) works 100% of the time:

{
    "data" : {
        "title": "Test Notification",
        "body": "This offer expires at 11:30 or whatever",
        "notId": 10,
        "surveyID": "ewtawgreg-gragrag-rgarhthgbad"
    }
}

When your app is in the foreground any on('notification') handlers you have registered will be called. If your app is in the background, then the notification will show up in the system tray. Clicking on the notification in the system tray will start the app, and your on('notification') handler will be called with the following data:

{
    "message": "This offer expires at 11:30 or whatever",
    "title": "Test Notification",
    "additionalData": {
        "surveyID": "ewtawgreg-gragrag-rgarhthgbad"
    }
}

Link to the docs

Answer 2

Below is the code has worked for me. When the app is closed, and you receive a notification. If you want to handle the click event by looking into some payload data. Then have a look at below code:

pushObject.on('notification').subscribe((notification: any) => {

    // this method will be called when you click on notification when app is closed
    pushObject.finish()
       .then(e => {})
       .catch(e => { console.log("ERROR NOTIFICATION",e); })

}).catch(e => {
    console.log("ERROR NOTIFICATION",e);
})

Answer 3

You can check the forground by the following code:

pushObject.on('notification').subscribe((data: any) => {
      console.log('message -> ' + data.message);
      //if user using app and push notification comes
      if (data.additionalData.foreground) {
        // if application open, show popup
      }
      else{
       //if user NOT using app and push notification comes
      }

For more details to send push notifications in Ionic you can visit:

https://medium.com/@ankushaggarwal/push-notifications-in-ionic-2-658461108c59