Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Device is not defined error pops up when launching my Phonegap Push notification app

I used the example source code from (https://github.com/phonegap-build/PushPlugin/tree/master/Example/www). Problem is that, when I install my app and launch it my android phone (or android SDK emulator), it fails to register device to Android GCM. All the time error pops-up - "Device is not defined". I dont know exactly how I can catch error, why it fails to register device.

Steps that I preformed is:

  1. – Created Phonegap project

  2. – Installed following 3 plugins (cordova-plugin-device.git, cordova-plugin-media.git, PushPlugin).

  3. – Registered App in Google Android GCM and retrieved my Goolge cloud API and Project Number
  4. Locate the PushNotification.js file that was installed into my project-root/plugins folder. This file was copied into my project-root/www folder and referenced from the index.html
  5. Added in my index file
  6. Added to my www/config.xml file
  7. Added JQuery mobile JS + CSS files to my project
  8. Changed senderID in my HTML code:"1111146417746
  9. Builded app with CLI - phonegap build android

And here is my Index.html code:

<html>
    <head>
        <title>com.PhoneGap.c2dm</title>
    </head>
    <body>


        <!--<script type="text/javascript" charset="utf-8" src="cordova-2.2.0.js"></script>-->
     <link rel="stylesheet" href="ext/jquery/jquery.mobile-min.css">
    <script type="text/javascript" src="ext/jquery/jquery-min.js"></script>
    <script type="text/javascript" src="ext/jquery/jquery.mobile-min.js"></script>
    <script type="text/javascript" src="ext/jquery.qrcode.js"></script>
        <script type="text/javascript" charset="utf-8" src="cordova.js"></script>
        <script type="text/javascript" src="PushNotification.js"></script>

        <script type="text/javascript">
            var pushNotification;

            function onDeviceReady() {
                $("#app-status-ul").append('<li>deviceready event received</li>');

                document.addEventListener("backbutton", function(e)
                {
                    $("#app-status-ul").append('<li>backbutton event received</li>');

                    if( $("#home").length > 0)
                    {
                        // call this to get a new token each time. don't call it to reuse existing token.
                        //pushNotification.unregister(successHandler, errorHandler);
                        e.preventDefault();
                        navigator.app.exitApp();
                    }
                    else
                    {
                        navigator.app.backHistory();
                    }
                }, false);

                try 
                { 
                    pushNotification = window.plugins.pushNotification;
              $("#app-status-ul").append('<li>registering ' + device.platform + '</li>');
                    if (device.platform == 'android' || device.platform == 'Android' ||
                            device.platform == 'amazon-fireos' ) {
            pushNotification.register(successHandler, errorHandler, {"senderID":"111111117746","ecb":"onNotification"});        // required!
                    } else {
                        pushNotification.register(tokenHandler, errorHandler, {"badge":"true","sound":"true","alert":"true","ecb":"onNotificationAPN"});    // required!
                    }
                }
                catch(err) 
                { 
                    txt="There was an error on this page.\n\n"; 
                    txt+="Error description: " + err.message + "\n\n"; 
                    alert(txt); 
                } 
            }

            // handle APNS notifications for iOS
            function onNotificationAPN(e) {
                if (e.alert) {
                     $("#app-status-ul").append('<li>push-notification: ' + e.alert + '</li>');
                     // showing an alert also requires the org.apache.cordova.dialogs plugin
                     navigator.notification.alert(e.alert);
                }

                if (e.sound) {
                    // playing a sound also requires the org.apache.cordova.media plugin
                    var snd = new Media(e.sound);
                    snd.play();
                }

                if (e.badge) {
                    pushNotification.setApplicationIconBadgeNumber(successHandler, e.badge);
                }
            }

            // handle GCM notifications for Android
            function onNotification(e) {
                $("#app-status-ul").append('<li>EVENT -> RECEIVED:' + e.event + '</li>');

                switch( e.event )
                {
                    case 'registered':
                    if ( e.regid.length > 0 )
                    {
                        $("#app-status-ul").append('<li>REGISTERED -> REGID:' + e.regid + "</li>");
                        // Your GCM push server needs to know the regID before it can push to this device
                        // here is where you might want to send it the regID for later use.
                        console.log("regID = " + e.regid);
                    }
                    break;

                    case 'message':
                        // if this flag is set, this notification happened while we were in the foreground.
                        // you might want to play a sound to get the user's attention, throw up a dialog, etc.
                        if (e.foreground)
                        {
                            $("#app-status-ul").append('<li>--INLINE NOTIFICATION--' + '</li>');

                                // on Android soundname is outside the payload. 
                                    // On Amazon FireOS all custom attributes are contained within payload
                                    var soundfile = e.soundname || e.payload.sound;
                                    // if the notification contains a soundname, play it.
                                    // playing a sound also requires the org.apache.cordova.media plugin
                                    var my_media = new Media("/android_asset/www/"+ soundfile);

                            my_media.play();
                        }
                        else
                        {   // otherwise we were launched because the user touched a notification in the notification tray.
                            if (e.coldstart)
                                $("#app-status-ul").append('<li>--COLDSTART NOTIFICATION--' + '</li>');
                            else
                            $("#app-status-ul").append('<li>--BACKGROUND NOTIFICATION--' + '</li>');
                        }

                        $("#app-status-ul").append('<li>MESSAGE -> MSG: ' + e.payload.message + '</li>');
                        //android only
                        $("#app-status-ul").append('<li>MESSAGE -> MSGCNT: ' + e.payload.msgcnt + '</li>');
                        //amazon-fireos only
                        $("#app-status-ul").append('<li>MESSAGE -> TIMESTAMP: ' + e.payload.timeStamp + '</li>');
                    break;

                    case 'error':
                        $("#app-status-ul").append('<li>ERROR -> MSG:' + e.msg + '</li>');
                    break;

                    default:
                        $("#app-status-ul").append('<li>EVENT -> Unknown, an event was received and we do not know what it is</li>');
                    break;
                }
            }

            function tokenHandler (result) {
                $("#app-status-ul").append('<li>token: '+ result +'</li>');
                // Your iOS push server needs to know the token before it can push to this device
                // here is where you might want to send it the token for later use.
            }

            function successHandler (result) {
                $("#app-status-ul").append('<li>success:'+ result +'</li>');
            }

            function errorHandler (error) {
                $("#app-status-ul").append('<li>error:'+ error +'</li>');
            }

            document.addEventListener('deviceready', onDeviceReady, true);

         </script>
        <div id="home">
            <div id="app-status-div">
                <ul id="app-status-ul">
                    <li>Cordova PushNotification Plugin Demo</li>
                </ul>
            </div>
        </div>
    </body>
</html>
like image 641
user3432056 Avatar asked Aug 08 '14 08:08

user3432056


3 Answers

Go to your plugins folder and check whether you have a folder named cordova-plugin-device. That plugin should be installed in your project. So if that folder is missing you need to install it by opening your terminal and going to the root of your project to execute the following command

cordova plugin add cordova-plugin-device

This should add the plugin.

like image 176
woodroxx Avatar answered Nov 16 '22 11:11

woodroxx


Found a solution for this myself. As it turned out, these two JS files:

 <script type="text/javascript" charset="utf-8" src="cordova.js"></script>
 <script type="text/javascript" src="PushNotification.js"></script>

had to been moved in HEAD section, not inside BODY section. Then it works fine!

like image 3
user3432056 Avatar answered Nov 16 '22 10:11

user3432056


Put your registration code under DeviceReady function

var platform = null;
        document.addEventListener("deviceready", onDeviceReady, false);
        function onDeviceReady() {
          platform = device.platform;
          //alert(platform);
          $("#app-status-ul").append('<li>'+ platform +'</li>');
          try 
            { 
                pushNotification = window.plugins.pushNotification;
          $("#app-status-ul").append('<li>registering ' + device.platform + '</li>');
                if (device.platform == 'android' || device.platform == 'Android' ||
                        device.platform == 'amazon-fireos' ) {
        pushNotification.register(successHandler, errorHandler, {"senderID":"860557673192","ecb":"onNotification"});        // required!
                } else {
                    pushNotification.register(tokenHandler, errorHandler, {"badge":"true","sound":"true","alert":"true","ecb":"onNotificationAPN"});    // required!
                }
            }
            catch(err) 
            { 
                txt="There was an error on this page.\n\n"; 
                txt+="Error description: " + err.message + "\n\n"; 
                alert(txt); 
            } 
        }
like image 2
suraj mahajan Avatar answered Nov 16 '22 09:11

suraj mahajan