Menu
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);
});
}
}
385
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" />
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);
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");
}
}
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.
1
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
