Can't get cordova network plugin to work

ionic-v1
1

Hi,
I am trying to create a simple ionic app that alerts the current connection status of the application.
I am building through the command line then open the xcode project and running on an iPad mini. Below is the steps I took, but I always get TypeError: Cannot read property ‘type’ of undefined

Can anyone suggest anything I can try to get past this?
Thanks

Steps
ionic start testNetwork sidemenu
cd testNetwork
ionic platform add ios
ionic build ios
cordova plugin add org.apache.cordova.network-information

** edit the AppCtrl to include **
$ionicPlatform.ready(function() {
alert(navigator.connection.type);
});

ionic build ios
** open via xcode and run on iPad mini **

2

It looks like it can’t find the navigator.connection object.
Try running it through ionic cli with live reload and client logging enabled so you can see output:
ionic run ios -l -c

You could try and acccess it through window.navigator

Also, rather than using alert, try:
console.log(JSON.stringify(window.navigator)) to see if connection is defined at all.

Also, you could try using the ngCordova wrapper for the plugin http://ngcordova.com/docs/#Network which is a more Angular way of doing things.

3

@edd Thanks for the suggestions, really pulling my hair out with this one I’ve went back to start cordova tutorials and lots of other things just can’t seem to get plugins to work at all.

This is the output from debugging on the iPad when I do console.log(JSON.stringify(window.navigator))

1     281141   log      {"appCodeName":"Mozilla","appName":"Netscape","appVersion":"5.0 (iPad; CPU OS 8_1 like Mac OS X) AppleWebKit/600.1.4 (KHTML, like Gecko) Mobile/12B410 (392684912)","language":"en-gb","userAgent":"Mozilla/5.0 (iPad; CPU OS 8_1 like Mac OS X) AppleWebKit/600.1.4 (KHTML, like Gecko) Mobile/12B410 (392684912)","platform":"iPad","plugins":{"0":{"0":{},"1":{},"2":{},"3":{},"4":{},"5":{},"6":{},"7":{},"8":{},"9":{},"10":{},"11":{},"12":{},"13":{},"14":{},"15":{},"16":{},"17":{},"18":{},"19":{},"20":{},"21":{},"22":{},"23":{},"24":{},"25":{},"26":{},"27":{},"28":{},"29":{},"30":{},"31":{},"32":{},"33":{},"name":"QuickTime Plug-in","filename":"QuickTime Plugin.webplugin","description":"The QuickTime Plug-in allows you to view a wide variety of multimedia content in web pages. For more information, visit the <A HREF=\"http://www.apple.com/quicktime\">QuickTime</A> Web site.","length":34},"length":1},"mimeTypes":{"0":{},"1":{},"2":{},"3":{},"4":{},"5":{},"6":{},"7":{},"8":{},"9":{},"10":{},"11":{},"12":{},"13":{},"14":{},"15":{},"16":{},"17":{},"18":{},"19":{},"20":{},"21":{},"22":{},"23":{},"24":{},"25":{},"26":{},"27":{},"28":{},"29":{},"30":{},"31":{},"32":{},"33":{},"length":34},"product":"Gecko","productSub":"20030107","vendor":"Apple Computer, Inc.","vendorSub":"","cookieEnabled":true,"onLine":true,"standalone":false,"geolocation":{}}
1 Like
4

Yeah, so the connection object isn’t present on window.navigator, so it looks like the plugin hasn’t installed properly or is not in the location in the variable scope that you are looking.

I would try using the ngCordova wrapper for the network plugin and see what response that gives - save you having to specify the location at all.

module.controller('MyCtrl', function($scope, $cordovaNetwork) {
  var type = $cordovaNetwork.getNetwork();
});

If that doesn’t work or you really don’t want to use ngCordova then you could try the following:

In your platforms\ios folder, is the plugin there? If not, try re-adding the plugin or maybe try removing and re-adding the ios platform.

ionic platform remove ios
ionic platform add ios

Different plugins are accessed from different places e.g. I’m using the StatusBar plugin that’s accessed directly from window.StatusBar, then another plugin “AppRate” from window.navigator.apprate and the the Keyboard plugin from window.cordova.plugins.Keyboard, so you may just want to debug a bit more with console.log to see if your network plugin is located somewhere other than window.navigator.

5

Thanks again for the help @edd.

I’ve included $cordovaNetwork and updated the controller to the below but it throws the same error on the $cordovaNetwork.getNetwork() - Error: undefined is not an object (evaluating ‘navigator.connection.type’)

 $ionicPlatform.ready(function() {
	console.log($cordovaNetwork.getNetwork());
	console.log($cordovaNetwork.isOnline());
	console.log($cordovaNetwork.isOffline());
	console.log(JSON.stringify(window.navigator));
  });

I’ve removed and readded both the platform and the plugins and still no joy. Below is a screenshot of my current ios folder.

6

I’ve got it sorted. Basically the config.xml within the platform folders is being updated with the plugins but the config.xml in the root of the project was not. When I investigated in XCode it seems the root config.xml was the one it was referencing so I’ve updated this and no can access my plugins.

Thanks for the help again.

1 Like
7

No worries. Glad you got it sorted.

8

Maybe this help for installing future plugins:
Add needed platforms to app.
Install plugins.
Run cordova build.
Run the app.

Because Cordova build creates all the nessecary files for installed plugins into the added platforms directories.

9

For all the future visitors of this thread; I wrote a step by step tutorial on how to create an application that uses the cordova network plugin, and you can take a look at it here: http://www.nikola-breznjak.com/blog/codeproject/check-network-information-change-with-ionic-famework/.

Please let me know if it will prove to be helpful to you.

10

After spending 2 hrs, nothing worked for me. I have installed cordova network plugin, also checked my androidmanifest.xml file everything was as suggested by other users. What worked for, i am posting here

  1. add below code to index.html

In offline template i am simply showing “No internet connection” mesage. As soon as you go online, it will open app home page. and when you go offline it opens offline page.

11

Hey GartType,

Can you give me what configuration you have updated to get this working?

12

It helped to me, thanks!