Ionic push notifications are really easy to implement but if you couldn't find the best tutorial to use push notification yet it can't be easy at the first. Due to this reason I decide to prepare this small tutorial for ionic developers.
Lets start with easy steps.
Android Push Notification
- Create Firebase account at here https://firebase.google.com/
- After creating your firebase account click to "GO TO CONSOLE" button from right top corner of page. (you should redirect to https://console.firebase.google.com/ link.)
- Click to "Create Project" button and enter dummy values to input. Just care about application package name while you fill the input, it should has same name with your project root directory config.xml file widget id value.
- Then end of the creating new project wizard you should download google-services.json file to your project "projectName/platforms/android/app/" directory.
- click the settings in the top of left nav bar and go to 'Cloud Messaging' menu.then copy your senderID to use following steps.
- then run the following commands in console
cd projectName
- Then open component.ts file and add to following codes.
import { Push, PushObject, PushOptions } from '@ionic-native/push';
- now when you start your application, you can get push message and regsiteredDeviceId values.
Lets start with easy steps.
Android Push Notification
- Create Firebase account at here https://firebase.google.com/
- After creating your firebase account click to "GO TO CONSOLE" button from right top corner of page. (you should redirect to https://console.firebase.google.com/ link.)
- Click to "Create Project" button and enter dummy values to input. Just care about application package name while you fill the input, it should has same name with your project root directory config.xml file widget id value.
- Then end of the creating new project wizard you should download google-services.json file to your project "projectName/platforms/android/app/" directory.
- click the settings in the top of left nav bar and go to 'Cloud Messaging' menu.then copy your senderID to use following steps.
- then run the following commands in console
cd projectName
ionic cordova plugin add phonegap-plugin-push --variable SENDER_ID=yoursenderId
npm install --save @ionic-native/push
- Then open component.ts file and add to following codes.
import { Push, PushObject, PushOptions } from '@ionic-native/push';
constructor(private push: Push) {
this.pushInit();
}
pushInit(){
const options: PushOptions = {
android: {
senderID:'put your senderId here'
},
ios: {
alert: 'true',
badge: true,
sound: 'false'
}
};
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));
}
- now when you start your application, you can get push message and regsiteredDeviceId values.
- after that you can use 'Cloud Messaging' link from left nav menu and send push message to all users or deviceId spesific users.