Push notification helps to send notifications to android devices without setting up your own server!! It will be easily done by using “Firebase Cloud Messaging service”.

This article briefly explains about sending "Push notifications" to your android device using “Firebase Cloud Messaging” Service with easy steps.

Prerequisites:

Need to know about Cordova and Command Line Interface to develop android applications. If you want to know how to set up Cordova and Android SDK, please refer this article.

Firebase Cloud Messaging:

Below shown the representation about systems which are involved in sending push notifications to your android app.

1.  Your Android App send request to Firebase server to generate unique token.

2.  Your Android App will receive token from Firebase server and it will get registered on your device.

3.  Your Android App will send the token to your server to save the firebase tokens to push notifications through firebase whenever needed.

4.   Client Server send a message to “Firebase” along with token.

5.   Firebase push messages to device.

Step 1: Creating “Android App” Project using Cordova CLI

Navigate to/create folder to create new project for this demo

$ cordova create CordovaPushApp com.android.MyCordovaPushApp CordovaPushDemo
$ cd CordovaPushApp
$ cordova platform add android

Step 2: Installing “Firebase” Push Plugin

Firebase Push plugin will allow your android application to interact with “Firebase Cloud Messaging” server by receiving unique tokens and notifications.

$ cordova plugin add cordova-plugin-firebase

Above command will add “Firebase” plugin in your project. After adding, it’s time to create project in “Firebase Cloud Messaging” system.

Step 3: Create project in FCM

1.       Go to https://console.firebase.google.com/

2.       Click on “Add Project” and create your project.

3.       After creating project, click on “Add Firebase to your Android App” Link present in the dashboard.

4.       Write the package name of you app, it will be present in the “AndroidManifest.xml” (refer package=”xxxxx” in the manifest line) and signing certificate is Optional.

5.       Click on “Register App” button to register the project.

6.       Click on “Download google-services.json” file to add it in your root of the project (i.e. place where config.xml present for your project). This step is very important and your app will take information from this JSON file before interacting with Firebase.

7.       Click on “Continue” button and complete the set up.

 Step 4: Register and get Firebase Token for your application

     Add “textbox” (name: txtFCMId) and 2 “buttons” in your html page and write the below lines of code in “Js” file on “Button Click” to    get the token from FCM.

1.       1st button it to register your app with firebase. (i.e. RegisterWithFCM() js method)

2.       2nd button it to receive “notifications” from firebase. (i.e. GetMessageFromGCM() JS Method)

function RegisterWithFCM() {

    try {

        if (window.FirebasePlugin == null) {

            alert("FCMPlugin is null")

            return;

        }

         window.FirebasePlugin.getToken(function (token) {

            //”token” received from FCM server.

            //It will get automatically registered in you device.No extra code is needed.

             alert(token);

            document.getElementById("txtGCMId").value = token;

        });

       }

catch (e) {

        alert(e);

       }

   }

function GetMessageFromGCM() {

    alert("onNotificationOpen");

     try {

        window.FirebasePlugin.onNotificationOpen(function (data) {

         alert(JSON.stringify(data));

        });

    } catch (e) {

        alert(e);

    }

}

You can explore different types of extension methods present in FirebasePlugin here (https://github.com/arnesson/cordova-plugin-firebase).

Step 5: Build and Install your android application

$ cordova run android

(or)

$ cordova build

Install APK file on your device and register the application using “FCM”.

Step 6: Send Notification to your application

1. Use the token received in the above step.

2. Select your Project in the FCM console.

3. Go to “Settings” and click on “Notification”. Refer below screenshot

4. Enter “Messages”, Select “Single Device” and enter “Key” values in the “Advanced Options” and click on “Send Message”

5. You will get notification on the mobile device as below. You can send notifications using "Post man" (or) "From your Web App" to devices which are registered with FCM. It will be covered in detail in my next article.

   You have done it!! Now your application will get push notifications from Firebase.