Disparity with message formats, unable to get "notification" to show up in recipient

[GeoffreyPlitt]

I'm trying to use this library to send PN's to a phone that receives them via https://github.com/zo0r/react-native-push-notification. I'm testing on a real device, and I've got some GCM connection working, because I can see received message in my logs, but the notifications do not show in the UI (device's notification area), and I think it's because of a disparity in the documentation regarding the message schema.

I've tried several different example messages, pulled from your docs, their docs, or other places, and I'm showing the resulting message received. I'm pretty confused, and I can't find a way that seems to allow both "notification" and "data" parts through. In fact, it seems like "data" is the only part that goes through, which may explain my issue. As a side note, part of the problem seems to be that the data is sometimes collapsed from JSON to string, is that happening in your lib for some reason? As another side note, is this related to FCM vs GCM?

Each of the example messages below is sent to sender.send(message, { registrationTokens: tokens }, ...)

const example1 = {
    collapseKey: 'demo',
    priority: 'high',
    contentAvailable: true,
    timeToLive: 3,
    data: {
        key1: 'message1',
        key2: 'message2'
    },
    notification: {
        title: "Hello, World",
        icon: "ic_launcher",
        body: "This is a notification that will be displayed ASAP."
    }
}

// RESULT:
// {
//   collapse_key: "com.stardust"
//   foreground: true
//   google.message_id: "0:1484096257740237%7ee359d17ee359d1"
//   google.sent_time: 1484096257734
//   id:"-1643774423"
//   key1:"message1"
//   key2:"message2"
//   userInteraction:false
// }

const example2 = {
  time_to_live: 86400,
  collapse_key: "new_message",
  delay_while_idle: false,
  notification: {
    title: "title",
    body: "this is a noisy test",
    tag: "new_message",
    icon: "new_message",
    color: "#18d821",
    sound: "default"
  }
}

// RESULT:
// {
//   collapse_key:"com.stardust"
//   foreground:true
//   google.message_id:"0:1484096278293346%7ee359d17ee359d1"
//   google.sent_time:1484096278289
//   id:"-762117123"
//   userInteraction:false
// }

const example3 = {
  data: {
    info: {
      subject: "Hello GCM2",
      message: "Hello from the server side!"
    }
  }

// RESULT
// {
//   collapse_key: "do_not_collapse"
//   foreground: true
//   google.message_id:"0:1484096309107031%7ee359d1f9fd7ecd"
//   google.sent_time:1484096309103
//   id:"-1292255135"
//   info:"{\"subject\":\"Hello GCM2\",\"message\":\"Hello from the server side!\"}"
//   userInteraction:false
// }

[eladnava]

Try setting the notification fields within the data payload e.g.:

data: {
    title: "Hello, World",
    icon: "ic_launcher",
    body: "This is a notification that will be displayed ASAP."
}

Ionic/Cordova had a bug that required this. Might be the same with React Native.

[GeoffreyPlitt]

Solved. If anyone else has these issues, here's what fixed it for me:

• Use version 2.1.0 of https://github.com/zo0r/react-native-push-notification.
• App must be in background for PN's to show in notification area; if in foreground, you have to receive it and then create a local one.
• Here's a payload that worked for me, sent via this lib:

{
      collapseKey: 'demo',
      priority: 'high',
      contentAvailable: true,
      timeToLive: 3,
      data: {
          key1: 'message1',
          key2: 'message2'
      },
      notification: {
          title: "Hello, World",
          icon: "ic_launcher",
          body: "This is a notification that will be displayed ASAP."
      }
    }

[eladnava]

Thanks for sharing the solution @GeoffreyPlitt!

[hypesystem]

It seems to me that what was missing from the docs was something about the app having to be in background for notifications to autotrigger. We could add this! :smile: