React-native-fcm: Is it possible to update the badge number when app gets a push notification and is in background/closed

Created on 29 Jan 2017  路  21Comments  路  Source: evollu/react-native-fcm

"react-native-fcm": "2.3."
"react-native": "0.36.
"
I'm using a iPhone 6 Plus v 10.2.

I am sending push notifications via postman:
e.g. {
"title": "Notification title",
"body": "Notification body",
"data": {},
"badge": 3,
"recipients": [id]
}

and when the app is in the background/closed the push notification banner shows and works perfectly but I'm trying to update the badge number using the badge key in the notification object.

Most helpful comment

I am not sure how to update badge numbers.
If I receive notification from server, is it automatically updated on my phone?
If server don't sends badge number count, I can't see badge icon on my phone.
How to get tracked badge count from server?
So I can send notification with badge count.
Is there anyway to get this?

All 21 comments

{
            to: user.gcm,
            notification: {
              "title": "Notification title",
              "body": "Notification body",
              "badge": 3
            },
            data: extraData

This doesn't work. It only responds with the object structure in my example.

This is the structure I'm using in my project. Should work
What is postman response?

{
"details": "message queued for processing",
"status": "success"
}

I'm sending this:

{
"badge" :"787",
"title": "Notification title",
"body": "Notification body",
"badge": 33,
"content-available" : "1",
"recipients": [
"token"
],
"data": {}
}

Here are screenshots of what the xcode debugger shows the notification as:
screen shot 2017-01-30 at 11 03 58 am

screen shot 2017-01-30 at 11 03 43 am
\

can you add "show_in_foreground" in "data" property?

closing this due to inactivity. feel free to reopen if you think necessary

Also having the same issue for the inactive state.

For the inactive/killed state the only way to update the badge number is through passing the badge property? If so, how does one increment rather than hardcoding the badge number on the server.

Thanks for the help!

The server keeps track of badge count of each device.

I am not sure how to update badge numbers.
If I receive notification from server, is it automatically updated on my phone?
If server don't sends badge number count, I can't see badge icon on my phone.
How to get tracked badge count from server?
So I can send notification with badge count.
Is there anyway to get this?

@binzailani3136 you can set the badge number via push notification sent via the firebase console. As for keeping track of the actual numbers, I'm not sure if it adds automatically. Havn't test it yet.

Edit: So I just quickly tested it. The badge numbers do not cumulate. So for example if originally you had a badge number 1. Then you send another push notification but set the badge number to 3. Then once the notif is received, the badge number will say 3 instead of 4 (if it is supposed to cumulate).

http://stackoverflow.com/questions/1942605/push-notification-badge-auto-increment

@evollu Where is the documentation that says that?

General question, if the app is closed, how would your JS parsing of the notification EVER be able ti increment the badge count using this library since your JS won't even get hit? Wouldn't this be an XCode thing?

If your app is close, you will have to send badge attribute in notification body. JS won't run and even native code won't run in some cases.
That is why we are managing users badge count on server side.

Right, but the only documentation I see is for a JS method call, FCM.setBadgeNumber(1); So even if it's int he notification body, how does it actually increment the badge count?

It sets badge count to the number you passes, not adding it to existing number.
There is no method to do auto increment.

That is why we are managing users badge count on server side.

@evollu then we have to maintain the viewed notification count on server i.e: as soon as notification is send to user increment the count later on viewing decrement it. Is that the only way to show unread notification count on app icon?

as far as i know, yes

I am using react-native-firebase and content-available in notification data triggers onNotificationDisplay function, even when app is killed/closed , my setup is something like :
````
this.notificationDisplayedListener = firebase.notifications().onNotificationDisplayed((notification: Notification) => {

    firebase.notifications().getBadge()
      .then( count => {
        count++
        firebase.notifications().setBadge(count)
     })
     .then(() => {
       console.log('Doing great')
     })
     .catch( error => {
       console.log('fail to count')
     })

})
````
of course this works only on iOS.

I am using react-native-firebase and content-available in notification data triggers onNotificationDisplay function, even when app is killed/closed , my setup is something like :

this.notificationDisplayedListener = firebase.notifications().onNotificationDisplayed((notification: Notification) => {

        firebase.notifications().getBadge()
          .then( count => {
            count++
            firebase.notifications().setBadge(count)
         })
         .then(() => {
           console.log('Doing great')
         })
         .catch( error => {
           console.log('fail to count')
         })

})

of course this works only on iOS.

I get badge only when i inside app. Not showing when app is closed/Minimised
can any one help

Hi, any updates here?

I am using react-native-firebase and content-available in notification data triggers onNotificationDisplay function, even when app is killed/closed , my setup is something like :

this.notificationDisplayedListener = firebase.notifications().onNotificationDisplayed((notification: Notification) => {

        firebase.notifications().getBadge()
          .then( count => {
            count++
            firebase.notifications().setBadge(count)
         })
         .then(() => {
           console.log('Doing great')
         })
         .catch( error => {
           console.log('fail to count')
         })

})

of course this works only on iOS.

@Dhanush623 @amitbravo Where actually should the code be placed?

@amitbravo @Dhanush623 I tried it and it only triggers when the app is in foreground. AFAIK JS doesn't run when the app is in background or closed, so I don't see how you could manage to get your listener to trigger here, but maybe i'm missing something ? How did you manage it ?
@zwanzigg better luck on your side ?

The weird thing is that on Android it works flawlessly. Would definitely be the first time something in RN is better handled on Android than iOS :)

Was this page helpful?
0 / 5 - 0 ratings