Ionic 3 send push notification with firebase data vs notification payload

Question

Im trying to make firebase push notification work on IONIC 3 using phonegap-plugin-push with @ionic-native/push plugin

This is my Ionic info

global packages:

Cordova CLI : 7.0.1

local packages:

@ionic/app-scripts : 2.1.3
Cordova Platforms  : android 6.2.3 ios 4.4.0
Ionic Framework    : ionic-angular 3.6.0

System:

Android SDK Tools : 25.2.2
Node              : v8.1.3
OS                : macOS Sierra
Xcode             : Xcode 8.3.3 Build version 8E3004b 
ios-deploy        : 1.9.1 
ios-sim           : 6.0.0 
npm               : 5.1.0

I cannot understand how create create the notification object server-site to make notification work either iOS and Android. I read all aboout difference from notification and data payload, then I cannot understand how the object has to be to work on all platforms and in all app state (background and foreground).

This is my initial object

  $p = array(
        'id'             => $post['id'],
        'title'             => $post['title'],
        'description'       => $post['description'],
        'text'              => $post['text'],
        'image_url'         => $post['image_url']
    );
    $msg = array(
        'title'     => "test",
        'body'      => $post['title'],
        'post'      => $p,
        'vibrate'   => 1,
        'sound'     => "default"
    );

    $fields = array();
    $fields['to']           =  "/topics/news";
    $fields['data']         = $msg;
    $fields["notification"] =  array('title' => 'test', 'body' => $post['title'],  'sound' => 1);

So I tried to put together data and notification payload The result is

Android Foreground ->notification arrived and I can go to detail page
Android Background -> notification arrived but on('notification') is not called, thus I cannot navigate through detail page
iOS Foreground -> notification arrived and I can go to detail page
iOS Background -> notification arrived and I can go to detail page

The only issue is cannot control Android in background.

If I use just data payload on Android all works (can go to detail page either in background and foreground) but on iOS notification don't arrive at all.

If I use just notification payload notification arrives on Andorid and iOS but without data payload, so My app doesn't go to detail page.

My question is: What kind of object I should send to make iOS and Android work in foreground and background??

Ruben Rocco De Luca · Accepted Answer · 2017-08-07T15:06:13.533

I read all documentation about firebase and phonegap-plugin-push. Here I found all explanation about notification and data payload. It's very weird what I read so I decide to open a new issue there. But I had to find a way out to solve my problem so I used firebase topic condition. I'll explain my way and I hope It could help someone. I dont like the way I used (in fact I hope that plugin'll be fixed), but it works.

I import Platform on .ts file where App is subscribed at the topic news.
I subscribed app to a topic 'ios' if platform is iOS or 'android' if platform is Android.

When a I send the push notification from server I create a payload like this:

private function really_send($post, $device_type)// $device_type == 0 iOS - $device_type == 1 Android {

$p = array(
    'id' => $post['id'],
    'title' => $post['title'],
    'description' => $post['description'],
    'text' => $post['text'],
    'image_url' => $post['image_url'],
    'date' => $post['date']
);
$msg = array(
    'title' => "Title",
    'body' => $post['title'],
    'post' => $p,
    'vibrate' => 1,
    'sound' => 1
);

$fields = array();
$fields["priority"] = "high";
if ($device_type == 0) {
    $fields['condition'] = "'ios' in topics && 'news' in topics";
    $fields["notification"] = array(
        'title' => 'Title',
        'body' => $post['title'],
        'sound' => 'default',
        'icon' => 'notification_icon'

    );
} else {
    $fields['condition'] = "'android' in topics && 'news' in topics";
}
$fields['data'] = $msg;


$url = 'https://fcm.googleapis.com/fcm/send';

$headers = array
(
    'Authorization: key=xxxx',
    'Content-Type: application/json'
);

$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, $url);
curl_setopt($ch, CURLOPT_POST, true);
curl_setopt($ch, CURLOPT_HTTPHEADER, $headers);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, true);
curl_setopt($ch, CURLOPT_IPRESOLVE, CURL_IPRESOLVE_V4);
curl_setopt($ch, CURLOPT_POSTFIELDS, json_encode($fields));
$result = curl_exec($ch);

}

This function is called twice (once for iOs with deviceType = 0 and once for Android with deviceType = 1) and I use topic condition So I create two different payload. In this way I made it work both iOS and Android in background and foreground status

Ionic 3 send push notification with firebase data vs notification payload

1 Answers1