Ionic2 Android application badge counter with receiving push notification in foreground and background

Ionic Framework ionic-v3
1

Hello,

I’m trying to get badges over the app icon with push notification receiving:

in app.components.ts I use this.increaseBadges(this.badgeNumber); in initPushNotification() from constructor platform.ready().then(() => { this.initPushNotification(); }) with previous let permission = await this.badge.requestPermission(); function to get permission value true. which is badgeNumber: number; variable, it works for foreground, but I’m not sure if it is proper way to use this variable in background to increase or decrease badge.

badgeAmount value increases with receiving of push notification in foreground from device debug console, but badge does not appears on icon. For example, increasing badge manually with button, shows counter circle on icon. Seems like I’m doing something completely wrong way. I’m not sure, how to get badges counter for Ionic2 Type Script Android application icon, with receiving push notification in background and foreground.

I’ve tried to use background plugin import { BackgroundMode } from '@ionic-native/background-mode'; to increase in background, but this way application freezes on loading. I’m not sure if I’m using background correctly, and if this solves badge problem in result.

2

For this you have to send the badge count with you payload in your server side.

3

@avishai_peretz_dev

Hello,

My server side is a php based on this example, which uses Firebase API_ACCESS_KEY. I am sending a JSON.stringify(mess) to php. If I get you right, it should contain badge: '1'. and then with receiving of push notification in app.components.ts with initPushNotification();. If I understand you correctly, instead of message: notification.message must be JSON.stringify(notification).

I found this guide, but how to attach this message badge number to badge increasing and then increase counter with receiving of several notifications from different devices

Is there any useful guide or example, how to create payload with badge for such case.

4

In your server side (php) script where you send push via fcm you pass payload so there you need to send the badge count.

5

@avishai_peretz_dev

Hello,

Thank you for your support

in result finally I got desired badge counter circle over the app icon with receiving push notification, but with receiving of second notification counter number is still 1.

What value I have to increase with +1 for each received notification, instead of this.badgeNumber; variable, which works only in foreground with this.increaseBadges(this.badgeNumber); in initPushNotification();?

badge: '1', of payload comes from the sender as fixed number, how to use it?

6

If you send 1 so you will receive one.
You need to manage any device data in your DB.
Which notification the device read and not read.