Apache Cordova / Phonegap Push Notification Tutorial – Part 2

Want create site? Find Free WordPress Themes and plugins.
receive-push-message-phonegap

receive-push-message-phonegap

Phonegap Push Notification Tutorial – Part 2 ( Setting up Apache Cordova / Phonegap Project for Receiving Push Notifications)

In this tutorial we’ll see how to setup Apache Cordova / Phonegap project for receiving push notifications.

  • Open Android SDK Manager (type android in terminal)
  • Make sure you’ve installed the required tools

sdk-manager-tools

Receiving Push Notification using Phonegap / Apache Cordova

  1. Create a New Project or use existing project
  2. Add platform such as android
  3. Add you Push Notification Plugin (https://github.com/phonegap/phonegap-plugin-push)
cordova plugin add phonegap-plugin-push --variable SENDER_ID="721393051486"

Apache Cordova / Phonegap Push Notification Example Code.

replace "senderID": "721393051486" with your own sender ID

var push = PushNotification.init({ "android": {"senderID": "721393051486"},
         "ios": {"alert": "true", "badge": "true", "sound": "true"}, "windows": {} } );

    push.on('registration', function(data) {
        // data.registrationId
    });

    push.on('notification', function(data) {
        // data.message,
        // data.title,
        // data.count,
        // data.sound,
        // data.image,
        // data.additionalData
    });

    push.on('error', function(e) {
        // e.message
    });

During Initiation

when GCM registration is success, you’ll receive GCM registration ID with has 256 char encrypted data by using data.registrationId. registrationId is an unique for all device & all application

While receiving Push Notification 

when you send Push Message from server, push.on('notification' will be called. you can receive these data such as message, title, count, sounds, image, additionalData. if some error occurred it’ll initiate push.on('error'

Apache Cordova / Phonegap Push Notification Full Example code

<!DOCTYPE html>
<html>
<head>
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
<title>Hello World</title>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript">
document.addEventListener("deviceready",onDeviceReady,false);
function onDeviceReady(){
 var push = PushNotification.init({ "android": {"senderID": "YOUR_SENDER_ID"}});
 push.on('registration', function(data) {
 console.log(data.registrationId);
 document.getElementById("gcm_id").innerHTML = data.registrationId;
 });

 push.on('notification', function(data) {
 alert(data.title+" Message: " +data.message);
 });

 push.on('error', function(e) {
 alert(e);
 });
}
</script>
</head>
<body>
<h1>Push Notification Example</h1>
Your GCM ID : <br/>
<p id="gcm_id"></p>
</body>
</html>

Compile this application and run on your device, you can see some Registration ID (256 char encrypted). i.e, your GCM ID like

APA91bFIj2WLkD3W4kbZcGO7dyI-TKKX0QpYCwtzqE2cNC0GbnUfQ7_gvQKOUloSb9T-6OZMxKdHXj8biiMYVgRJJP-C6b3PfpC7Kzu4G77PqMeGekHU9W6qTwnu0YTtWGNd6tGMBQka

Apache Cordova / Phonegap Push Notification is not working ?

  • Check whether you’ve installed Push Notification Plugin
  • Make sure, you’ve installed required tools in SDK Manager (see the above figure)
  • Check you’ve included cordova.js file with your project
  • Check your Sender ID which you’re created in GCM Projects
  • Make sure your internet connection

 

Read These,

Did you find apk for android? You can find new Free Android Games and apps.