Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save coolvasanth/ba61710cb68af4097acfe603765c2df3 to your computer and use it in GitHub Desktop.
Save coolvasanth/ba61710cb68af4097acfe603765c2df3 to your computer and use it in GitHub Desktop.
Before starting the push notifications in Ionic 2 please have a look at the official documentation of phonegap-push-plugin.
Here is the link for same.
(https://github.com/phonegap/phonegap-plugin-push/blob/master/docs/PAYLOAD.md#notification-vs-data-payloads)
Everything that I will be writting is choosen from above document but with much easier way.
Look at the below code in android scenario:(choosen from https://ionicframework.com/docs/native/push/)
//in src/app/app.component.ts
import { Push, PushObject, PushOptions } from '@ionic-native/push';
constructor(private push: Push) { }
// to check if we have permission
this.push.hasPermission()
.then((res: any) => {
if (res.isEnabled) {
console.log('We have permission to send push notifications');
} else {
console.log('We do not have permission to send push notifications');
}
});
// to initialize push notifications
const options: PushOptions = {
android: {
senderID: '12345679'
},
};
const pushObject: PushObject = this.push.init(options);
pushObject.on('notification').subscribe((notification: any) => console.log('Received a notification', notification));
pushObject.on('registration').subscribe((registration: any) => console.log('Device registered', registration));
pushObject.on('error').subscribe(error => console.error('Error with Push plugin', error));
//backend pay load will be of below format
{
"data" : {
"title": "Test Notification",
"body": "This offer expires at 11:30 or whatever",
"notId": 10,
"surveyID": "ewtawgreg-gragrag-rgarhthgbad"
}
}
please don't use the payload of below format in backend, It will create many
problems. ex: your app icon may not appear on the notification in some devices.
{
"notification": {
"title": "Test Notification",
"body": "This offer expires at 11:30 or whatever",
"notId": 10
},
"data" : {
"surveyID": "ewtawgreg-gragrag-rgarhthgbad"
}
}
If app is opened then pushObject.on() method will be triggered immediately as soon as notification
appers. It will not even appear in the status bar on top.
When the app is opened and you want to show the notification in the top notification tray, do a small
modification to the above code:
const options: PushOptions = {
android: {
senderID: '12345679',
forceShow: true, // this will force the notification to show on top of notification tray
},
};
How to handle the click event of notification ???
If you have set forceShow: true then notification will appear in the top and
pushObject.on('notification').subscribe((notification: any) .... will be called only after click of it.
By extracting the data from your payload you can perform any action that you want to do. The above solution
holds good even when the app is in the background. I repepat please follow the backend payload data
format that I have suggested above.
@ikishanoza
Copy link

forceShow: true I couldn't find this in official plugin documentation.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment