Check internet connection on iOS app with Cordova Phonegap 3.3.0 not working

Question

I have tried following this guide on Cordova docs, but it doesn't seem to work.

Here is my code:

I have added <plugin name="NetworkStatus" value="CDVConnection" /> to config.xml.

and this script to my index.html:

    <script type="text/javascript">


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

        // device APIs are available
        //
        function onDeviceReady() {
            alert("1"); // runs this alert
            checkConnection();
        }

        function checkConnection() {
            var networkState = Connection.CELL;
            alert("2"); // doesn't run this

            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>

var networkState = Connection.CELL; seems to cause the problem as it doesn't run the following alert, I have also tried navigator.connection.type but the same thing happened.

When I run the app in Chrome the console outputs the following error:

Uncaught ReferenceError: Connection is not defined 

Anybody know how to solve this problem?

Cheers

Answer 1

I finally solved the problem!! - by starting all over again from scratch and doing the following:

Command line:

sudo npm install -g cordova
cordova create hello com.example.hello HelloWorld
cd hello
cordova platform add ios
cordova platforms ls //This will list ios
cordova plugin add org.apache.cordova.network-information
cordova build

Then drag my files (HTML, Javascript etc) into the platforms/ios/www/ folder.

Open up hello.xcodeproj in xcode.

Edit config.xml and add the lines:

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

Then in my index file I used the JavaScript:

    <script type="text/javascript">
        document.addEventListener("deviceready", onDeviceReady, false);
        // device APIs are available
        function onDeviceReady() {
            if(navigator.network.connection.type == Connection.NONE){
                alert("nocon");
            }else{
                alert("yescon");
            }
        }
    </script>

Then run it in the iPhone / iPad simulator and it will output "yescon" if there is a connection and "nocon" if there isn't!!

Hope this helps!

Answer 2

Check if you have included your Cordova.js file in html.

<script type="text/javascript" src="cordova.js"></script>

And change App/Supporting Files/Cordova.plist of your project.

<key>Plugins</key>
     <dict>
     <key>NetworkStatus</key>
     <string>CDVConnection</string>
</dict>

Answer 3

This works for me:

if(navigator.network.connection.type == Connection.NONE){
//no connection
}else{
//You are connected.
}

Though I look in the documentation and looks like there's a difference using these lines:

var networkState = navigator.network.connection.type;

navigator.network.connection.type is set to Connection.CELL_2G for all cellular data.

Would it be var networkState = Connection.CELL_2G;?