Push Notification setup with Ionic2, Parse Server and Firebase

Parse Server now has integration with Firebase for sending push notification for both Android and iOS.

Firebase Notifications is a free service that enables targeted user notifications for mobile app developers.

Built on Firebase Cloud Messaging (FCM) and the FCM SDK, Firebase Notifications provides an option for developers and organizations seeking a flexible notification platform that requires minimal coding effort to get started, and a graphical console for sending messages. Using the Notifications console GUI, you can reengage and retain your user base, foster app growth, and support marketing campaigns.

Already using Google Cloud Messaging? Learn more about your options.

Obtain GCM Sender ID and API Key

First, you will need to obtain a Google Cloud Messaging Sender ID and API Key. You can follow only step 1 of this guide to obtain the Sender ID (equivalent to the Project Number) and API Key. You do not need to follow the other steps because Parse provides much of code to handle GCM registration for you. Remember the GCM Sender and API key provided.

Create a new project

Now put your app name and select your country.

• Now click on Add Firebase to Your Android App.

• Now you have to enter your projects package name and click on ADD APP.

Create Certain Google Play Service

Authenticating Your Client | Google APIs for Android | Google Developers

Then next, next, finish.

Note: For IOS, use this tutorial:

Provisioning APNs SSL Certificates | Firebase

Get your app API Key and GCM Sender Key

Setup environment variables in Heroku

If you are using Heroku to configure the server, make sure to set the following environment variables:

• Set FIREBASE_API_KEY and FIREBASE_SENDER_ID environment variables to correspond to the Sender ID and API Key in the previous step.

• Confirm the SERVER_URL environment variable is set to the URL and Parse mount location (i.e. http://yourappname.herokuapp.com/parse).
• *Add the CLIENT_KEY environment variable set to the key so that the application can authenticate the push with Parse Server

Setup environment variables in Digital Ocean

If you followed the tutorial on How Deploy Photogram Parse Server in Digital Ocean, follow these steps:

• First, open ecosystem.json file, in your local Photogram Parse Server folder and fill with your Firebase Keys

• Commit this changes and push updates, sample:

$ git add ecosystem.json
$ git commit -am "Firebase Push Configuration"
$ git push origin master

• Enter in your Digital Ocean server and update your server and reload PM2, sample:

$ ssh root@ip_droplet_ssh
$ cd server
$ git pull origin master
$ pm2 reload ecosystem.json

• Done, your Server configured!

Setup your Photogram Ionic 1 and 2

Now, for your application to receive push notifications, open the config.xml file and change the following locations with the settings you previously generated.

Once you have set up your server to push push and your application to receive, deploy to your mobile to test.

Note: To test, you must be logged in to an account, that is, after installing your application and registering and logging in, it will open the connection channel via push.Testando o Push com Firebase

Testing Push with Firebase Notification

To test whether your application is properly configured to receive notifications via Push, deploy to your mobile phone, create and log into an account, and then log in to the Firebase Messaging panel by following the images below:

Testing with Parse Dashboard

You can also test whether your Parse Server server is sending the messages via Push, as shown in the image below:

If you have made all the settings correctly, you will be receiving the push normally, but if you have any problems or questions, please post in the comments in the details so I can help you.