Device shown as Not Active

[HSLaw]

Hi, I try to do a push notification and below is the portion of the codes I used from the sample.

1. I manage to get a device (Android) registered and appear in the Devices List.
2. When I try to send Push Notification, it will show there is 1 Active device.
3. But the device never receive the push notification.
4. Next I check again the devices is shown as Not Active.

5. I also try to run the Sample directly and it can work and receive the Push Notification, so I think the problem might lies in my apps' code and not the device.
6. Is there anything I miss out?

001.//This is your Telerik BackEnd Services API key.
002.var baasApiKey = 'removed';
003.
004.//This is the scheme (http or https) to use for accessing Telerik BackEnd Services.
005.var baasScheme = 'http';
006.
007.//This is your Android project number. It is required by Google in order to enable push notifications for your app. You do not need it for iPhone.
008.var androidProjectNumber = 'removed';
009.
010.//Set this to true in order to test push notifications in the emulator. Note, that you will not be able to actually receive
011.//push notifications because we will generate fake push tokens. But you will be able to test your other push-related functionality without getting errors.
012.var emulatorMode = false;
013.
014.
015.var deviceready = function () {
016.
017.    alert('//Initialize the Everlive SDK');
018.     //Initialize the Telerik BackEnd Services SDK
019.    var el = new Everlive({
020.        apiKey: baasApiKey,
021.        scheme: baasScheme
022.    });
023.
024.
025.    var successText = "SUCCESS!<br /><br />The device has been initialized for push notifications.<br /><br />";
026.
027.        var _onDeviceIsRegistered = function() {
028.            $("#initializeButton").hide();
029.            $("#registerButton").hide();
030.            $("#unregisterButton").show();
031.            $("#messageParagraph").html(successText + "Device is registered in Telerik BackEnd Services and can receive push notifications.");
032.        };
033.
034.        var _onDeviceIsNotRegistered = function() {
035.            $("#unregisterButton").hide();
036.            $("#registerButton").show();
037.            $("#messageParagraph").html(successText + "Device is not registered in Telerik BackEnd Services. Tap the button below to register it.");
038.        };
039.
040.        var _onDeviceIsNotInitialized = function() {
041.            $("#unregisterButton").hide();
042.            $("#initializeButton").show();
043.            $("#messageParagraph").html("Device unregistered.<br /><br />Push token was invalidated and device was unregistered from Telerik BackEnd Services. No push notifications will be received.");
044.        };
045.
046.        var _onDeviceRegistrationUpdated = function() {
047.            $("#messageParagraph").html("Device registration updated.");
048.        };
049.
050.        var onAndroidPushReceived = function(args) {
051.            alert('Android notification received: ' + JSON.stringify(args));
052.        };
053.
054.        var onIosPushReceived = function(args) {
055.            alert('iOS notification received: ' + JSON.stringify(args));
056.        };
057.
058.        //Initializes the device for push notifications.
059.        var enablePushNotifications = function () {
060.            //Initialization settings
061.            var pushSettings = {
062.                android: {
063.                    senderID: androidProjectNumber
064.                },
065.                iOS: {
066.                    badge: "true",
067.                    sound: "true",
068.                    alert: "true"
069.                },
070.                notificationCallbackAndroid : onAndroidPushReceived,
071.                notificationCallbackIOS: onIosPushReceived
072.            }
073.
074.            $("#initializeButton").hide();
075.            $("#messageParagraph").text("Initializing push notifications...");
076.
077.            var currentDevice = el.push.currentDevice(emulatorMode);
078.
079.            currentDevice.enableNotifications(pushSettings)
080.                .then(
081.                    function(initResult) {
082.                        $("#tokenLink").attr('href', 'mailto:[e-mail]?subject=Push Token&body=' + initResult.token);
083.                        $("#messageParagraph").html(successText + "Checking registration status...");
084.                        return currentDevice.getRegistration();
085.                    },
086.                    function(err) {
087.                        $("#messageParagraph").html("ERROR!<br /><br />An error occured while initializing the device for push notifications.<br/><br/>" + err.message);
088.                    }
089.                ).then(
090.                    function(registration) {
091.                        _onDeviceIsRegistered();
092.                    },
093.                    function(err) {
094.                        if(err.code === 801) {
095.                            _onDeviceIsNotRegistered();
096.                        }
097.                        else {
098.                            $("#messageParagraph").html("ERROR!<br /><br />An error occured while checking device registration status: <br/><br/>" + err.message);
099.                        }
100.                    }
101.                );
102.        };
103.
104.        var registerInEverlive = function() {
105.            var currentDevice = el.push.currentDevice();
106.
107.            if (!currentDevice.pushToken) currentDevice.pushToken = "some token";
108.            el.push.currentDevice()
109.                .register({ Age: 15 })
110.                .then(
111.                    _onDeviceIsRegistered,
112.                    function(err) {
113.                        alert('REGISTER ERROR: ' + JSON.stringify(err));
114.                    }
115.                );
116.        };
117.
118.        var disablePushNotifications = function() {
119.            el.push.currentDevice()
120.                .disableNotifications()
121.                .then(
122.                    _onDeviceIsNotInitialized,
123.                    function(err) {
124.                        alert('UNREGISTER ERROR: ' + JSON.stringify(err));
125.                    }
126.                );
127.        };
128.
129.        var updateRegistration = function() {
130.            el.push.currentDevice()
131.                .updateRegistration({ Age: 16 })
132.                .then(
133.                    _onDeviceRegistrationUpdated,
134.                    function(err) {
135.                        alert('UPDATE ERROR: ' + JSON.stringify(err));
136.                    }
137.                );
138.        };
139.
140.
141.    enablePushNotifications();
142.
143.    registerInEverlive();
144.
145.};

[Anton Dobrev]

Hi,

When an Android push notification is created in BS, the payload along with the tokens of the targeted devices are sent to Google Cloud Messaging for Android. GCM sends the notification to the devices or returns an error if a token is invalid. The devices with an invalid token are marked as Active: false in the Backend Services data browser. You can read more in this documentation article.

In order to identify the problem on your side could you please verify the following:

• The notifications for the app are allowed. You can check this under Settings > Apps > MyPushApp on your Android device. Notifications are enabled by default in Android.
• The device is not registered in Everlive with a push token like: "fake _push_token".
• The sample app is deployed to an Android device and is not tested in the AppBuilder companion app. 
• The project number for your Google API project (a 12 char string) is entered in the client app as a value to the androidProjectNumber variable.
• The API key for server applications (a 39-char string) is entered in the backend portal under Settings > Push Notifications > Android. How to obtain it is explained in this article: Enabling GCM - Getting Started
• The Google Cloud Messaging for Android (GCM) service is enabled in your Google API project > APIS & AUTH > APIs.

In order to test the push workflow on your side you can download the Android GCM client for Windows, enter the device token and the API key for your GCM account and send a simple payload.

I look forward to your reply.

Regards,
Anton Dobrev
Telerik

 

 

[XiMnet Malaysia]

Hi Anton,

I checked and noticed the device is registered with an invalid token (some token).

Below is my JS codes and I noticed it never go to the function (initResult) - No Alert in device:

What could be the issue?
Thanks.

My JS Code:

document.addEventListener("deviceready", onDeviceReady, false);

// START push notication
//This is your Telerik BackEnd Services API key.
var baasApiKey = 'removed';

//This is the scheme (http or https) to use for accessing Telerik BackEnd Services.
var baasScheme = 'http';

//This is your Android project number. It is required by Google in order to enable push notifications for your app. You do not need it for iPhone.
var androidProjectNumber = 'removed';

//Set this to true in order to test push notifications in the emulator. Note, that you will not be able to actually receive
//push notifications because we will generate fake push tokens. But you will be able to test your other push-related functionality without getting errors.
var emulatorMode = false;
// end push notication

// PhoneGap is loaded and it is now safe to make calls PhoneGap methods
function onDeviceReady() {
    $("#messageParagraph").html("device ready " + baasApiKey);

      //Initialize the Telerik BackEnd Services SDK
    var el = new Everlive({
        apiKey: baasApiKey,
        scheme: baasScheme
    });

      var successText = "SUCCESS!<br /><br />The device has been initialized for push notifications.<br /><br />";

     var _onDeviceIsRegistered = function() {
            //$("#initializeButton").hide();
            //$("#registerButton").hide();
            //$/("#unregisterButton").show();
            $("#messageParagraph").html(successText + "Device is registered in Telerik BackEnd Services and can receive push notifications.");
     };

        var _onDeviceIsNotRegistered = function() {
           // $("#unregisterButton").hide();
           // $("#registerButton").show();
            $("#messageParagraph").html(successText + "Device is not registered in Telerik BackEnd Services. Tap the button below to register it.");
        };

        var _onDeviceIsNotInitialized = function() {
          //  $("#unregisterButton").hide();
          //  $("#initializeButton").show();
            $("#messageParagraph").html("Device unregistered.<br /><br />Push token was invalidated and device was unregistered from Telerik BackEnd Services. No push notifications will be received.");
        };

        var _onDeviceRegistrationUpdated = function() {
            $("#messageParagraph").html("Device registration updated.");
        };

        var onAndroidPushReceived = function(args) {
            $("#messageParagraph").html('Android notification received: ' + JSON.stringify(args));
        };

        var onIosPushReceived = function(args) {
            $("#messageParagraph").html('iOS notification received: ' + JSON.stringify(args));
        };

        //Initializes the device for push notifications.
        var enablePushNotifications = function () {
            //Initialization settings
            var pushSettings = {
                android: {
                    senderID: androidProjectNumber
                },
                iOS: {
                    badge: "true",
                    sound: "true",
                    alert: "true"
                },
                notificationCallbackAndroid : onAndroidPushReceived,
                notificationCallbackIOS: onIosPushReceived
            }

            //$("#initializeButton").hide();
            $("#messageParagraph").text("Initializing push notifications...");

            var currentDevice = el.push.currentDevice(emulatorMode);

            currentDevice.enableNotifications(pushSettings)
                .then(
                    function(initResult) {
                       // $("#tokenLink").attr('href', 'mailto:[e-mail]?subject=Push Token&body=' + initResult.token);
                        alert("initResult");
                        debugger;
                        $("#token").html(initResult.token);

                        $("#messageParagraph").html(successText + "Checking registration status...");
                        return currentDevice.getRegistration();
                    },
                    function(err) {
                        $("#messageParagraph").html("ERROR!<br /><br />An error occured while initializing the device for push notifications.<br/><br/>" + err.message);
                    }
                ).then(
                    function(registration) {
                        _onDeviceIsRegistered();

                    },
                    function(err) {
                        if(err.code === 801) {
                            _onDeviceIsNotRegistered();
                        }
                        else {
                            $("#messageParagraph").html("ERROR!<br /><br />An error occured while checking device registration status: <br/><br/>" + err.message);
                        }
                    }
                );
        };

        var registerInEverlive = function() {
            var currentDevice = el.push.currentDevice();

            if (!currentDevice.pushToken) currentDevice.pushToken = "some token";
            el.push.currentDevice()
                .register({ Age: 15, emulatorMode: emulatorMode })
                .then(
                    _onDeviceIsRegistered,
                    function(err) {
                        alert('REGISTER ERROR: ' + JSON.stringify(err));
                    }
                );
        };

        var disablePushNotifications = function() {
            el.push.currentDevice()
                .disableNotifications()
                .then(
                    _onDeviceIsNotInitialized,
                    function(err) {
                        alert('UNREGISTER ERROR: ' + JSON.stringify(err));
                    }
                );
        };

        var updateRegistration = function() {
            el.push.currentDevice()
                .updateRegistration({ Age: 16 })
                .then(
                    _onDeviceRegistrationUpdated,
                    function(err) {
                        alert('UPDATE ERROR: ' + JSON.stringify(err));
                    }
                );
        };

     $('#btn-enable-push').click(function(){
        alert("ss")  ;
        enablePushNotifications();
    });

    $('#btn-register-device').click(function(){
          registerInEverlive();

    });

}

My HTML code:

<!DOCTYPE html>

<html>
    <head>

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="format-detection" content="telephone=no" />


       <style type="text/css">
.big-btn {
    -moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
    -webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
    box-shadow:inset 0px 1px 0px 0px #ffffff;
    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf) );
    background:-moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf');
    background-color:#ededed;
    -webkit-border-top-left-radius:6px;
    -moz-border-radius-topleft:6px;
    border-top-left-radius:6px;
    -webkit-border-top-right-radius:6px;
    -moz-border-radius-topright:6px;
    border-top-right-radius:6px;
    -webkit-border-bottom-right-radius:6px;
    -moz-border-radius-bottomright:6px;
    border-bottom-right-radius:6px;
    -webkit-border-bottom-left-radius:6px;
    -moz-border-radius-bottomleft:6px;
    border-bottom-left-radius:6px;
    text-indent:0;
    border:1px solid #dcdcdc;
    display:inline-block;
    color:#777777;
    font-family:arial;
    font-size:15px;
    font-weight:bold;
    font-style:normal;
    height:50px;
    line-height:50px;
    width:90%;
    text-decoration:none;
    text-align:center;
    text-shadow:1px 1px 0px #ffffff;
}

.header{padding: 10px; background-color: #dfdfdf;font-family:arial;
    font-size:15px;font-weight:bold;}

.log{padding: 5px; border: solid 1px black; margin: 5px}

       </style>


    <title>Login</title>
    </head>

    <body>

        <div style="text-align: center;" >
            <div class="header">Push Notification</div>
            <br />
            <div class="big-btn" id="btn-enable-push">Enable Push Notification</div>
            <div class="big-btn" id="btn-register-device">Register Device</div>
        </div>
        <br /><br />
         <div class="log" id="messageParagraph">Messages</div>

        <br />
        <div class="log" id="token">token</div>

        <script type="text/javascript" src="cordova.js"></script>
        <script src="js/jquery.min.js"></script>
        <script src="js/lib/everlive.all.js"></script>
        <script type="text/javascript" charset="utf-8" src="js/push_notification.js"></script>

    <!--<script type="text/javascript" charset="utf-8" src="https://bs-static.cdn.telerik.com/latest/everlive.all.min.js"></script>-->


    </body>

</html>

[Anton Dobrev]

Hello,

I tried your code and it is running as expected. For your convenience I attached the project. To run it import in in your favorite Appbuilder client, and enter your Backend Services API key and Google API Project number (the 12 digit number of your project in the Google Developer API) as strings. Also, find attached a screenshot so that you can confirm if this is the expected behavior of the app. The only changes that I made were to add the external libraries from a CDN and import your code in index.js and index.html.

In addition, for further information about this matter you can examine our documentation article about the push workflow in JS applications and the official demo app.

Let me know if this works for you.

Best regards,
Anton Dobrev
Telerik

 

 

[XiMnet Malaysia]

It is working now. Thanks.

[Paul-Henri]

And What was the solution?

[HSLaw]

I use the code from sample-push.zip and it works.

[Paul-Henri]

Ok thank you! :)