An error has occurred: The object 'navigator.connection.type' is not defined (evaluating 'navigator.connection.type')

Question

An error has occurred: The object 'navigator.connection.type' is not defined (evaluating 'navigator.connection.type')

I am currently in the process of developing a Cordova app and utilizing the Cordova network-information plugin org.apache.cordova.network-information. Lately, I have been encountering an unusual bug when debugging in Safari's web inspector that reads "TypeError 'undefined' is not an object (evaluating 'navigator.connection.type')". The app functions properly during the initial load, but upon further navigation within the app, this error appears and causes the app to freeze. This issue seems to be more prevalent in iOS 8 compared to Android Lollipop where it occurs sporadically. Despite trying various suggestions and resources related to this problem, I have not been able to find a solution. My setup includes Cordova version 4.3 and iOS 8.1. Any assistance on resolving this would be greatly appreciated. Apologies for being unable to provide images due to insufficient reputation.

function checkConnection() { 
    alert(navigator.connection.type);
    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';
    if(networkState == Connection.UNKNOWN || networkState == Connection.NONE){
        navigator.notification.alert('No Network Available',null,"Warning");
        sessionStorage.setItem('UserID',"");
        $.mobile.changePage("#loginPage", {
                            transition: 'none',
                            showLoadMsg: true
                            });
        return false;
    }else{
        return true;
   }
}

javascript android ios cordova

Answer 1

Answer №1

The issue I encountered was related to incorrectly calling the function outside of the device ready event handler. To resolve this, I made the following adjustment:

document.addEventListener("deviceready", function(){
     // Implement your navigator.connection.type logic here 
    }, false);

Answer 2

The issue I encountered was related to incorrectly calling the function outside of the device ready event handler. To resolve this, I made the following adjustment:

document.addEventListener("deviceready", function(){
     // Implement your navigator.connection.type logic here 
    }, false);

Answer 3

Answer №2

Make sure that you have properly defined the following:

<feature name="NetworkStatus">
         <param name="android-package" value="CDVConnection" />
 </feature>

The feature name should be 'Network status' and the value should be your class name.

Also, in the Android Manifest file, include the following permission:

<uses-permission android:name="android.permission.READ_PHONE_STATE"/>

Don't forget to check cordova_plugin.js for the necessary configurations:

cordova.define('cordova/plugin_list', function (require, exports, module) {
    module.exports = [{
        "file": "plugins/org.apache.cordova.dialogs/www/notification.js",
        "id": "org.apache.cordova.dialogs.notification",
        "merges": ["navigator.notification"]
    }, {
        "file": "plugins/org.apache.cordova.network-information/www/network.js",
        "id": "org.apache.cordova.network-information.network",
        "clobbers": ["navigator.connection", "navigator.network.connection"]
    }];
    module.exports.metadata = // TOP OF METADATA 
    {
        "org.apache.cordova.device": "0.2.8",
        "org.apache.cordova.network-information": "0.2.7"
    }
});

Answer 4

Make sure that you have properly defined the following:

<feature name="NetworkStatus">
         <param name="android-package" value="CDVConnection" />
 </feature>

The feature name should be 'Network status' and the value should be your class name.

Also, in the Android Manifest file, include the following permission:

<uses-permission android:name="android.permission.READ_PHONE_STATE"/>

Don't forget to check cordova_plugin.js for the necessary configurations:

cordova.define('cordova/plugin_list', function (require, exports, module) {
    module.exports = [{
        "file": "plugins/org.apache.cordova.dialogs/www/notification.js",
        "id": "org.apache.cordova.dialogs.notification",
        "merges": ["navigator.notification"]
    }, {
        "file": "plugins/org.apache.cordova.network-information/www/network.js",
        "id": "org.apache.cordova.network-information.network",
        "clobbers": ["navigator.connection", "navigator.network.connection"]
    }];
    module.exports.metadata = // TOP OF METADATA 
    {
        "org.apache.cordova.device": "0.2.8",
        "org.apache.cordova.network-information": "0.2.7"
    }
});

Answer 5

Answer №3

I encountered a similar issue while using cordova-plugin-network-information. I observed that even though the function was being called after "deviceready" event, the navigator.connection.type object remained undefined. To work around this, I introduced a 200ms delay before accessing the object.

function checkConnection(){
    try{
        console.log(navigator.connection.type);
    }
    catch(e){
        alert("error : "+e);
    }

    setTimeout(function(){
        var networkState = navigator.connection.type;
        console.log(networkState);

        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]);
        if(states[networkState] == "No network connection"){
            window.location.assign("lostConnection.html");
        }
    }, 200);
}

Initially, the "try/catch" block may encounter errors due to the undefined object, but eventually, after a short delay, retrieving navigator.connection.type succeeds. At least it did for me!

Answer 6

I encountered a similar issue while using cordova-plugin-network-information. I observed that even though the function was being called after "deviceready" event, the navigator.connection.type object remained undefined. To work around this, I introduced a 200ms delay before accessing the object.

function checkConnection(){
    try{
        console.log(navigator.connection.type);
    }
    catch(e){
        alert("error : "+e);
    }

    setTimeout(function(){
        var networkState = navigator.connection.type;
        console.log(networkState);

        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]);
        if(states[networkState] == "No network connection"){
            window.location.assign("lostConnection.html");
        }
    }, 200);
}

Initially, the "try/catch" block may encounter errors due to the undefined object, but eventually, after a short delay, retrieving navigator.connection.type succeeds. At least it did for me!

An error has occurred: The object 'navigator.connection.type' is not defined (evaluating 'navigator.connection.type')

Answer №1

Answer №2

Answer №3

Similar questions

Node.js error message: Unable to load HTTP module

Understanding Gradle's BuildConfigFields Syntax

How can you display two images by hovering your mouse over them?

Calculate the sum in real-time using JavaScript

Ultimate 2022 Android handbook for saving data to filesDir in MVVM repository

Determine the position of an item in an array specified by the user

Steps for turning off the browser's postback warning dialog

Shuffled NSMutableArray elements were inserted into a different NSMutableArray in a mixed-up fashion

preclude any dates prior to the chosen date

Rotating arrows enhance the functionality of the accordion menu

The functionality of the <select-vue> component in Vue.js does not support null values

Include the «Load More» option in the data output retrieved using $.getJSON from a Google Spreadsheet

Creating a JavaScript function to download specific sections of an HTML page

The webpage is completely blank, displaying only a stark white screen

Issue occurred in module.js:341 while attempting to include android platform to ionic using command line

Using express to efficiently redirect from a search form?

At which location do you configure the applicationIconBadgeNumber?

Bring about a transformation in the background color of a form upon losing focus after inputting text

Guide to using JavaScript to populate the dropdown list in ASP

ASP.NET Core does not support jQuery.validate functionality