Phonegap Network Connection - Cannot read property 'type' of undefined

android ios cordova phonegap-plugins

14,039

Solution 1

You want to use the plugin found here: http://build.phonegap.com/plugins/626

<gap:plugin name="org.apache.cordova.network-information" version="0.2.7" />

Solution 2

I have posted this idea here already: https://stackoverflow.com/a/19319817/2390075

What i have noticed is that networkState doesn't get always initialised immediately. So what worked for me is adding a small delay after checking the state first and then checking it again, in your case it should look like this:

var networkState = navigator.connection && navigator.connection.type;

setTimeout(function(){
    networkState = navigator.connection && 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.NONE]     = 'No network connection';

    $("#system_popup").html('Connection type: ' + states[networkState]);
    $("#system_popup").popup("open")
    //alert('Connection type: ' + states[networkState]);
}, 500);

Solution 3

Late answer, but this worked perfectly for me:

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

// device APIs are available
function onDeviceReady() {
    if(navigator.network.connection.type == Connection.NONE){
        alert("nocon");
    }else{
        alert("yescon");
    }
}

Solution 4

Realize this is a very old thread but I recently (11/2019) encountered the Cordova Plugin Network Information throwing an undefined when I was trying to get network.connection.type on Android (seems fine on iOS). I tried some of the above solutions but nothing helped. Eventually I got it working on Android by calling:

navigator.connection['type']

instead of

navigator.connection.type

No idea why but that now works.

View more solutions

14,039

Author by

The Duke Of Marshall שלום

GitHub https://github.com/DukeOfMarshall/

Updated on July 25, 2022

Comments

The Duke Of Marshall שלום almost 2 years

I have been searching around all day for the answer to this and the Google-sphere has not provided any answers. I have tried everything I know how to do and worked through the suggested solutions and answers and nothing has worked.

In a nutshell I am trying to develop a Phonegap app for Android and Apple Mobile devices and one of the features I need is to detect both the network status and the type of network connection. Below is the code I am using.

The Firing device ready alert fires off and then I get the error Cannot read property 'type' of undefined followed by the looping through of the Navigator object. As I go through each of these properties of the object I do not see the connection property or even the network property as was used in older versions.

Anyone have any ideas?

index.html

<!DOCTYPE html>
<html>
<head>

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<!-- jQuery Core -->
<script src="js/jquery-1.11.1.min.js"></script>
<!-- The main engine for the software. -->
<script src="js/main.js"></script>

<!-- Third party plugins -->
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="barcodescanner.js"></script>
<script type="text/javascript" src="childbrowser.js"></script>
<script type="text/javascript" src="js/barcode.js"></script>

<title>index</title>

<script>
document.addEventListener("deviceready", onDeviceReady, false);
</script>

</head>
<body>


<script>
barcode_app.initialize();
</script>

</body>
</html>

main.js

function onDeviceReady(){
    alert('Firing device ready');
    try{
        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.NONE]     = 'No network connection';

        $("#system_popup").html('Connection type: ' + states[networkState]);
        $("#system_popup").popup("open")
        //alert('Connection type: ' + states[networkState]);
    }catch(e){
        alert(e);
        $.each(navigator, function(key, value){
            alert(key+' => '+value);
        });
    }
}

And in my config.xml I have:

<plugin
        name="NetworkStatus"
        value="org.apache.cordova.NetworkManager" />

<gap:config-file platform="android" parent="/manifest">
        <uses-permission name="android.permission.ACCESS_NETWORK_STATE" />
    </gap:config-file>

    <gap:config-file platform="android" parent="/manifest">
        <uses-permission name="android.permission.INTERNET" />
    </gap:config-file>

    <gap:config-file platform="android" parent="/manifest">
        <uses-permission name="android.permission.READ_PHONE_STATE" />
    </gap:config-file>

<feature name="http://api.phonegap.com/1.0/device" />
    <feature name="NetworkStatus">
        <param name="android-package" value="org.apache.cordova.NetworkManager" />
        <param name="ios-package" value="CDVConnection" />
    </feature>

UPDATE : SOLUTION

A solution was finally formulated through the combined efforts of @Dawson Loudon and @benka. Dawson corrected the plugin I was using which should have been:

<gap:plugin
        name="org.apache.cordova.network-information"
        version="0.2.7" />

And this really only works correctly after implementing the short delay mentioned by @benka. So now the working code looks like this in JavaScript:

function onDeviceReady(){
    try{
        var networkState = navigator.connection && navigator.connection.type;

        setTimeout(function(){
            networkState = navigator.connection && 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.NONE]     = 'No network connection';

            alert('Connection type: ' + states[networkState]);
        }, 500);
    }catch(e){
        alert(e);
        $.each(navigator, function(key, value){
            alert(key+' => '+value);
        });
    }
}