How can I implement ionic io push notifications on Android

Question

I am having an issues with implementing push notifications using ionic.io and phonegap-plugin-push. This is my development environment::

our system information:

Cordova CLI: 6.2.0
Gulp version: CLI version 3.9.1
Gulp local: 
Ionic Framework Version: 1.3.1
Ionic CLI Version: 1.7.15
Ionic App Lib Version: 0.7.2
OS: Distributor ID: LinuxMint Description: Linux Mint 17.1 Rebecca 
Node Version: v0.12.2

Installed platforms:
android 5.1.1

Testing Device:
Samsung Galaxy Core Prime LTE Android 4.4.4 (rooted)

So I followed the tutorial at www dot devdactic dot com/ionic-push-notifications-guide/ and tried to implement the push notifications using the plugins

ionic add ionic-platform-web-client
ionic plugin add phonegap-plugin-push --variable SENDER_ID="1234567890"

Now I was able to get the development or demo push notification working in my browser. However, when I try to implement the real push notification and test it on a device, it does not work. When the app launches, it successfully generates a device token as expected from the tutorial. However, when I use the token to send a CURL or Postman http request for the push notification, I get a json response exactly like I do with a successful dev_push notification (HTTP Status 201) but I never receive the actual push notification on my device. I have double checked everything like making sure dev_push is set to false, and I even tried the tutorial 3 times from scratch, as well as the tutorial in the ionic documentation. In all cases I successfully generate a dev token and my cURL request gives a positive response but nothing is received on the device.

My code::

app.js:

angular.module('starter', ['ionic'])

.run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {

    var push = new Ionic.Push({
      "debug": true
    });

    push.register(function(token) {
      console.log("Device token:",token.token);
      push.saveToken(token);  // persist the token in the Ionic Platform
    });

    if(window.cordova && window.cordova.plugins.Keyboard) {
      // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
      // for form inputs)
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);

      // Don't remove this line unless you know what you are doing. It stops the viewport
      // from snapping when text inputs are focused. Ionic handles this internally for
      // a much nicer keyboard experience.
      cordova.plugins.Keyboard.disableScroll(true);
    }
    if(window.StatusBar) {
      StatusBar.styleDefault();
    }
  });
})

index.html ---> http://pastebin.com/p9zwYXiQ

config.xml, package.json,postman request & response ---> http://pastebin.com/YT2Kn64W

Answer 1

I got this working surprisingly on Android! Ionic shitty out-dated documentation doesn't really help a lot here. I ended up creating a new app, migrating the www folder to the new, just to avoid troubles. Then, make sure you do what ionic says in the docs in addition to the following:

Create a new Firebase account from Google Firebase console, yes that was never mentioned in the docs. When you first define your project, make sure the package name is the same defined in the config.xml in your ionic project's root. You will be given a new project id (SENDER_ID) and an api key by Firebase.

Update the SENDER_ID in your app.js push initiation code.

Very important!!: Firebase will walk you through how to update your gradle project, they are 10 seconds changes, you wont get the notifications if you dont add them though!.

project_root --> platforms --> android --> build.gradle:

// under buildscript { ... dependencies { ..
// paste this:
classpath 'com.google.gms:google-services:3.0.0'
// at the bottom of the file paste this
apply plugin: 'com.google.gms.google-services'

Make sure you paste these lines in the correct location

Run in the terminal - use your new SENDER_ID here

cordova plugin add phonegap-plugin-push --variable SENDER_ID=SENDER_ID --save

Update the API key from app --> Certificates - Only for android!!

run the commands: // rebuild ionic platform files

ionic build android

Running the app from your real device, -c -l are for liveReaload and logging console in the terminal

ionic run android --device -l -c

Good luck with that.

Answer 2

I kept trying but unfortunately I never got it to work. I wasted an entire week at work with this thing. Fortunately I found an alternative that worked and is very easy to use. Push Notifications with OneSignal:

https://documentation.onesignal.com/docs/phonegap-sdk-setup