Phonegap (online build) app - no internet connection and network status

Question

My first jquery mobile app contains elements which needs datas from Internet sources like public Google calendars and Amazon affiliate widgets but it works only when I testing in my chrome browser or on a Kindle Fire device with the html5 app tester. If I build android release apk with the online Phonegap, the Kindle and other android device like a Lenovo mobile can't reach the Internet connection in the app. I've read the all of topics in this issue and found the it was proposed to use <access origin="*" subdomains="true" /> in the config.xml but it was ineffective. I also put code snippets in the app like:

    if (navigator.onLine) {
  $("#ifonline").append("Online");
} else {
   $("#ifonline").append("offline");

}

var isOffline = 'onLine' in navigator && !navigator.onLine;

if ( isOffline ) {
    $("#ifonline2").append("Status: offline");
}
else {
    $("#ifonline2").append("online");
}

But the result is nothing. My config.xml:

<?xml version="1.0" encoding="UTF-8" ?>
    <widget xmlns   = "http://www.w3.org/ns/widgets"
        xmlns:gap   = "http://phonegap.com/ns/1.0"
        id          = "com.myapp.myapptodo"
        versionCode = "10" 
        version     = "1.0.0" >
    <name>myapp</name>

    <description>
        myapp is very good but can't find that &@ĐäĐ wifi!
    </description>

    <author href="https://mysite" email="mymail">
        Ceatos
    </author>

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

    <feature name="http://api.phonegap.com/1.0/geolocation"/>
    <feature name="http://api.phonegap.com/1.0/media"/>
    <feature name="http://api.phonegap.com/1.0/network"/>
    <feature name="http://api.phonegap.com/1.0/notification"/>
    <feature name="InAppBrowser">
    <param name="android-package" value="org.apache.cordova.InAppBrowser"/>
    </feature>

    <feature name="NetworkStatus">
    <param name="android-package" value="org.apache.cordova.networkinformation.NetworkManager" />
</feature>

    <access origin="*" subdomains="true" />

I have a working wifi network and the devices is connected to it. What should I do?

Answer 1

Add the whitelist plugin

<gap:plugin name="cordova-plugin-whitelist" source="npm" />

You might need to add this meta tag on the head

<meta http-equiv="Content-Security-Policy" content="default-src *; style-src *  'unsafe-inline'; script-src *  'unsafe-inline'; media-src *">

And add this two lines to the config.xml

<allow-navigation href="http://*/*" />
<allow-intent href="https://*/*" />

Answer 2

For checking internet connection I use this function:

function checkConnection(){
            var networkState = navigator.connection.type;
            if(Connection.NONE==networkState)
                return "<p>No connection</p>";
}

For being able yo use it you have to add the network state plugin this way:

cordova plugin add cordova-plugin-network-information

Your AndoidManifest file should include this two lines:

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