'onNotification' not fired in background - (iOS)

I’m using OneSignal to send push notifications to my react-native app. On iOS, everything works really well when the app is in the foreground. When the app is in the background, I see the notification on the lockscreen but my onNotification is not fired until I open the app (tried it both with the screen on and the screen off)

Haven’t tested this yet on Android

[npomfret]

Ok, its a bit confusing, but I have both android and iOS notifications working. Here’s what I discovered:

There are 3 types of notification both both iOS and Android. The first type, and the least interesting I guess is the sort that doesn’t make it into your app. They just appear in the notification centre, they can make a noise, vibrate the device and display some text. The android ones can be quite sophisticated. But, basically they look like this (not all possible fields are represented):

iOS:

{
  "aps":{
    "badge":8,
    "alert":"You have 8 unread messages",
    "sound":"default"
  }
}

Android:

{
  "to":"token",
  "time_to_live":86400,
  "collapse_key":"new_message",
  "delay_while_idle":true,
  "notification":{
    "title":"some title",
    "body":"You have 5 unread messages",
    "tag":"new_message",
    "icon":"new_message",
    "color":"#18d821",
    "sound":"default"
  }
}

The 2nd type are really ones we’re interested in which are the notifications that make their way into you app. They don’t cause any vibrations or make any sound. Now, I believe you can combine the 2 but don’t bother, for reasons I’ll explain below. These look like:

iOS:

{
  payload: {"yourField":"goes here"}, 
  aps: {"sound": "default", "category": "cat", "content-available": 1}
}

Note: "content-available": 1 is very important here.

Android

{
  "to":"token",
  "time_to_live":86400,
  "collapse_key":"new_message",
  "delay_while_idle":true,
  "data":{
    "payload":{
      "yourField":"goes here"
    }
  }
}

Note: the absence of a notification field is intentional.

To get hold of the data in the payload in my onNotification method in RN I do something along the lines of:

      let payload;
      if (Platform.OS === 'android' && notification.payload) {
        payload = JSON.parse(notification.payload)
      } else if (notification.data && notification.data.payload) {
        payload = JSON.parse(notification.data.payload)
      }

The 3rd and final type is the internal notification, basically your RN app sending a notification to your own device. Now my reason for saying don’t combine type 1 and 2 is that it’s easier and I think better to send an internal notification in response the receiving a type 2 message. If you use an internal notification you have the highest control of what they look like. You can specify sounds, colours, vibrations, message body, message title, numbers etc (again, the android ones can be quite sophisticated but this API doesn’t support it all yet). So when you receive a type 2 notification, in your onNotification callback you can then alert the user (if you like) with something noisy and vibraty, like:

PushNotification.localNotification({
        title: "this is at the top",
        autoCancel: true,
        icon: "new_message",
        vibrate: true,
        vibration: 300,
        subText: "this is at the bottom",
        color: "#18d821",
        id: 22,
        tag: "some_tag",
        group: "group",

        /* iOS and Android properties */
        message: "hello! something really cool is going on",
        number: 99,
        playSound: true
      });

(Again, not all possible fields are shown in this example)

Note: the message field is super important here and is a special field used by this api to populate the text of the internal notification.

[yonahforst]

@npomfret

If you want to do anything in react upon receiving a background fetch you’ll need to retain the completion handler and then call it once your work is done. Calling the completion handler right away causes the app to go straight back into the background.

See this thread: https://github.com/facebook/react-native/issues/1282#issuecomment-189201873

Here’s an example of my implementation:

-(void)application:(UIApplication *)application didReceiveRemoteNotification:(NSDictionary *)userInfo fetchCompletionHandler:(void (^)(UIBackgroundFetchResult))completionHandler {

  [RCTPushNotificationManager didReceiveRemoteNotification:userInfo];

  dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(10 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
    completionHandler(UIBackgroundFetchResultNewData);
  });
}