Cordova network plugin error in Ionic sample app

1

I get a strange problem with the cordova network plugin in a test app with Ionic
I have this code into Run method

angular.module(‘starter’, [‘ionic’, ‘starter.controllers’, ‘starter.services’])

.run(function($ionicPlatform,$ionicPopup) {
$ionicPlatform.ready(function() {
// Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
// for form inputs)

  var networkState = navigator.connection.type;

  var states = {};
  states[Connection.UNKNOWN]  = 'Unknown connection';
  states[Connection.ETHERNET] = 'Ethernet connection';
  states[Connection.WIFI]     = 'WiFi connection';
  states[Connection.CELL_2G]  = 'Cell 2G connection';
  states[Connection.CELL_3G]  = 'Cell 3G connection';
  states[Connection.CELL_4G]  = 'Cell 4G connection';
  states[Connection.CELL]     = 'Cell generic connection';
  states[Connection.NONE]     = 'No network connection';

  var stringa=('Connection type: ' + states[networkState]);

       $ionicPopup.alert({
           title: 'Test',
           template: states[networkState]
       });

…

This code work fine into a test device (genymotion) if the network is available (3G or WIFI) but if the data is not available (Connection.NONE) the app crash…
Ionic 1.0.8 …
Any suggestion? Thank you in advance

2

I’ve had a similar experience with the plugin.

When I put my phone into airplane mode, my app crashes immediately.

3

.factory(‘NetworkService’, [’$q’, function($q) {

    var Connection = window.Connection || {
        'ETHERNET': 'ethernet',
        'WIFI': 'wifi',
        'CELL_2G': 'cell_2g',
        'CELL_3G': 'cell_3g',
        'CELL_4G': 'cell_4g',
        'CELL': 'cell',
        'EDGE': 'edge',
        'UNKNOWN': 'unknown',
        'NONE': 'none'
    };

    var loaded = false;
    var connType = null;

    return {
        isOnline: function() {
            var blnReturn = true;

            switch (this.getStatus()) {
                case Connection.NONE:
                case Connection.UNKNOWN:
                    blnReturn = false;
                    break;
            }

            return blnReturn;
        },
        getStatus: function() {
            if (connType) {
                return connType.type;
            }
            if (typeof device !== 'undefined') {
                if ((device.platform === "Android") && navigator && navigator.network && navigator.network.connection) {
                    connType = navigator.network.connection || {
                        type: 'UNKNOWN'
                    };
                } else {
                    if ((device.platform === "iOS") && navigator && navigator.connection) {
                        connType = navigator.connection || {
                            type: 'UNKNOWN'
                        };
                    }
                }
            }
            if (!connType) {
                connType = { type: 'none'};
            }
            return connType.type;
        }
    };
}]);
4

Thank you for the response. I have edit my code using your factory as

angular.module(‘starter.controllers’, [‘test’])

.controller(‘DashCtrl’, function($scope,$ionicPopup,NotificationService,NetworkService) {

    if(NetworkService.isOnline()) {
        $ionicPopup.alert({
            title: 'on',
            template: 'ok'
        });
    }else{
        $ionicPopup.alert({
            title: 'off',
            template: 'no'
        });
    }

})

angular.module(‘test’,)

.factory(‘NetworkService’, [‘$q’, function($q) {

var Connection = window.Connection || {
    'ETHERNET': 'ethernet',
    'WIFI': 'wifi',
    'CELL_2G': 'cell_2g',
    'CELL_3G': 'cell_3g',
    'CELL_4G': 'cell_4g',
    'CELL': 'cell',
    'EDGE': 'edge',
    'UNKNOWN': 'unknown',
    'NONE': 'none'
};

var loaded = false;
var connType = null;

return {
    isOnline: function() {
        var blnReturn = true;

        switch (this.getStatus()) {
            case Connection.NONE:
            case Connection.UNKNOWN:
                blnReturn = false;
                break;
        }

        return blnReturn;
    },
    getStatus: function() {
        if (connType) {
            return connType.type;
        }
        if (typeof device !== 'undefined') {
            if ((device.platform === "Android") && navigator && navigator.network && navigator.network.connection) {
                connType = navigator.network.connection || {
                    type: 'UNKNOWN'
                };
            } else {
                if ((device.platform === "iOS") && navigator && navigator.connection) {
                    connType = navigator.connection || {
                        type: 'UNKNOWN'
                    };
                }
            }
        }
        if (!connType) {
            connType = { type: 'none'};
        }
        return connType.type;
    }
};

}]);

but i get a strange behavior:

  1. the factory don’t retrieve the correct state: i receive always the state off
  2. when in the device i stop the data connection the app crash

:frowning:

5

I have made a more simple app, using cordova create for test if the problem was the code or the network plugin

Now i have this simple html file

<!DOCTYPE html>
<html>
<head>
    <title>navigator.connection.type Example</title>

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

        // Wait for device API libraries to load
        //
        document.addEventListener("deviceready", onDeviceReady, false);

        // device APIs are available
        //
        function onDeviceReady() {
            checkConnection();
        }

        function checkConnection() {
            var networkState = navigator.connection.type;

            var states = {};
            states[Connection.UNKNOWN]  = 'Unknown connection';
            states[Connection.ETHERNET] = 'Ethernet connection';
            states[Connection.WIFI]     = 'WiFi connection';
            states[Connection.CELL_2G]  = 'Cell 2G connection';
            states[Connection.CELL_3G]  = 'Cell 3G connection';
            states[Connection.CELL_4G]  = 'Cell 4G connection';
            states[Connection.CELL]     = 'Cell generic connection';
            states[Connection.NONE]     = 'No network connection';

            alert('Connection type: ' + states[networkState]);
        }

    </script>
</head>
<body>
<p>A dialog box will report the network state.</p>
</body>
</html>

The code work fine, but also now if the connection wifi and data is stopped the app crash

May be a bug of the plugin?

6

I’m not sure if this helps or not, but I just had the same exact issue with my phonegap project. I corrected it by removing the network plugin version 0.2.9 and installing 0.2.8. I’m not using the ionic framework for this project, but I have used it before and what I’m doing in very similar. I did this by using the cordova cli commands. Good luck.

7

I am using 0.2.8 of the network plugin and I am NOT experiencing this issue. I am using cordova and ionic. Hope that helps.

8

Thank you: with a downgrade to 0.9.8 version the code works fine

2 Likes