Unable to detect no internet connection, in cordova app

Question

I have been searching on how to check internet connection for my cordova app(targeting android at the moment). I have tried the following:

 $.ajax("rss file url", {
            contentType: "application/json; charset=utf-8",
            dataType: 'jsonp',
            crossDomain: true
        })
               .done(function (data, textStatus, jqXHR) {
                //get rss
               })
               .fail(function (jqXHR, textStatus, errorThrown) {
                  //no internet alert
               })
               .always(function () {
                   //alert("complete");
               });

Also I have tried

function doesConnectionExist() {

    var xhr = new XMLHttpRequest();
    var file = "file url";
    var randomNum = Math.round(Math.random() * 10000);

    xhr.open('HEAD', file + "?rand=" + randomNum, false);

    try {
        xhr.send();

        if (xhr.status >= 200 && xhr.status < 304) {
            return true;
        } else {
            return false;
        }
    } catch (e) {
       return false;
    }
}

The problem is that these work absolutely fine in visual studio's ripple emulators, but when I debug on android device I am getting always getting no connection result. Eventhough, the device is connected to wi-fi. My app works fine if I remove this check. But, I need to check internet connectivity as my app is basically a rss feed reader. Any help would be appreciated.

I have tried the solution mentioned here I have already posted the $.ajax code. The problem is that the solution works fine on the ripple emulators. But when I release build on an android device from VS15, I keep getting no internet connection results.

Answer 1

I would use

document.addEventListener("online", yourCallbackFunction, false);

Then set some sort of variable to true in your callback function.

There's a same event for "offline".

This way you can also handle what happens if the user drops connection while using your app.

Source: http://docs.phonegap.com/en/1.8.1/cordova_events_events.md.html#online

Answer 2

I used a JS Library called OnlineJs and it works just fine to detect online and offline status.

try this link :

http://pixelscommander.com/polygon/onlinejs

Answer 3

function doesConnectionExist() {

    var xhr = new XMLHttpRequest();
    var file = "file url";
    var randomNum = Math.round(Math.random() * 10000);
connection=getConnectionStatus();
if(connection){
 xhr.open('HEAD', file + "?rand=" + randomNum, false);

    try {
        xhr.send();

        if (xhr.status >= 200 && xhr.status < 304) {
            return true;
        } else {
            return false;
        }
    } catch (e) {
       return false;
    }
}

Now inside the getConnectionStatus check for the connection.

   function getConnectionStatus() {
    var networkState = navigator.connection.type;
            var states = {};
            states[Connection.UNKNOWN]  = 'unknown';
            states[Connection.ETHERNET] = 'ethernet';
            states[Connection.WIFI]     = 'wifi';
            states[Connection.CELL_2G]  = '2g';
            states[Connection.CELL_3G]  = '3g';
            states[Connection.CELL_4G]  = '4g';
            states[Connection.CELL]     = 'cellular';
            states[Connection.NONE]     = 'none';
             if(networkState != 'none') { 
                   return true;
                } else {
                    return false;
                }

    }

the states[] array is for undeerstanding as to what all types of network information u can manipulate with .

Hope it helps.