Header Ads

Push Notification in Ionic 3

Push Notification with Firebase

Push Notification allows the developer to notify the all user at any time, a user has an app will receive them. push Notification can be implemented in (android, ios, windows) with ionic Push plugin.

Firebase Cloud messaging

Firebase is used to create a device token and server key, Go to firebase console, create a new project and select the setting.
In that project, a user gets the sender Id and server key to set push notification.


Goto project setting, and Add firebase to android app, To register an Android app, copy the package name in config.xml and set it. 


Download the google-service.JSON file and move the google-service.JSON into the app-module project directory and click finish.

Install Push plugin

Install ionic native push plugin, for register and receiving notification. replace the sender-id with the push option in SENDER-ID. 

    ionic cordova plugin add phonegap-plugin-push --variable SENDER-ID=xxxxx
    npm install --save @ionic-native/push

Import the push plugin in app-module and then use it in app-component.

  import { Push, PushObject, PushOptions } from '@ionic-native/push';
     const options: PushOptions = {
         android: {
             senderID: 'xxxxxxxxx'
         ios: {
             alert: 'true',
             badge: true,
             sound: 'false'
         windows: {},

      const pushObject: PushObject = this.push.init(options);

      pushObject.on('notification').subscribe((notification: any) => {
      if (notification.additionalData.foreground) {
      let youralert = this.alertCtrl.create({
        title: 'New Push notification',
        message: notification.message
      pushObject.on('registration').subscribe((registration: any) => console.log('Device registered',      registration));

      pushObject.on('error').subscribe(error => console.error('Error with Push plugin', error));

Now test the push Plugin, by push sample message from firebase and notification display in mobile.
when opening it, it displays in the app.

Post a Comment


  1. Good Post! Thank you so much for sharing this pretty post, it was so good to read and useful to improve my knowledge as updated one, keep blogging…
    ionic training in chennai

  2. When your successful streak stops, resume your initial minimal wager until the desk goes sizzling again. The casino's biggest benefit (the "home edge") is that the participant has to behave first. If a participant "busts" , the casino immediately takes the participant's 토토사이트 cash. If the casino then "busts" on the same hand, the participant nonetheless loses.

  3. I got some valuable points through this blog. csgo ranked accounts

  4. A platform for cloud computing called Amazon Web Services offers users a variety of cloud services. AWS (Amazon Web Services) can be characterised as a safe platform for cloud services that provides computing power, database storage, content distribution, and a number of other features.
    AWS Training in Chennai
    AWS Training in Bangalore
    AWS Course in Coimbatore