PhoneGap/Cordova app notifications

Question

I am new to PhoneGap/Cordova, i am looking to add some notifications to my app.

1. Push notification - so when a new article is released on app it will alert the users.

2. Local Notifications - On set intervals (date and time) I can prompt the user of the latest articles on my app.

I had done a lot of searching but unable to find a working example that I can import straight into a project and then modify.

I have tried the following plugin in but was unable to get it working https://github.com/katzer/cordova-plugin-local-notifications/

Answer 1

Steps for enabling push notifications in project.

1. create a project in https://console.developers.google.com/ with your project name.

2. Refer the below link for push plugin installation https://github.com/phonegap/phonegap-plugin-push/blob/master/docs/INSTALLATION.md

3. Code in your push.js file Refer https://github.com/phonegap/phonegap-plugin-push/blob/master/docs/API.md

   //code: push notification initialization and registration.

   if (!$window.PushNotification) {
   return;
   }
    var push = $window.PushNotification.init({
   android: {
       senderID: "Include your app sender ID XXXXXXX” 
   },
   ios: {
       alert: "true",
       badge: true,
       sound: 'false'
   },
   windows: {}
   });
   
   push.on('registration', function(data) {
   // this gives the unique deviceId, Or you can maintain array of deviceIds to register multiple devices.
   // if have specified single deviceId for example
   // save this deviceId in database for further operations, i.e. push messages to those ids.
   console.log(data.registrationId);
   });
   
   push.on('notification', function(data) {
   console.log(data.message);
   });
   
   push.on('error', function(e) {
   console.log(e.message);
   });
   push.off('notification', function(e) {
   console.log('off notify');
    });
   

4. There are several ways to send push notification. Here I'm taking help of gcm-server to notify. You will need to install node-gcm. Create a new server.js file.

    var gcm = require('node-gcm');
    var message = new gcm.Message();
   //API Server Key
    var sender = new gcm.Sender('GIVE_YOUR_SERVER_API_KEY');
   var registrationIds = [];
   
    // Value the payload data to send...
   message.addData('message',"\u270C Peace, Love \u2764 and PhoneGap \u2706!");
   message.addData('title','Push Notification Sample' );
   message.addData('msgcnt','3'); // Shows up in the notification in the status bar
   message.addData('soundname','beep.wav'); //Sound to play 
   message.timeToLive = 3000;
   

   // At least one reg id required // Here use the registration Ids that you got during device registration.

   registrationIds.push('xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx');

   sender.send(message, registrationIds, 4, function (result) { console.log(result); });

Refer http://devgirl.org/2013/07/17/tutorial-implement-push-notifications-in-your-phonegap-application/ for clear understanding of sending notification via gcm-server. This will show the notification on the device.

You can also make use of firebase instead of gcm.

Steps for enabling local notification: Add plugin to your project using cordova plugin add https://github.com/katzer/cordova-plugin-local-notifications

Invoke the local notification as shown in the link https://github.com/katzer/cordova-plugin-local-notifications/