Network status not reliable

[rmartin94]

Bug Report

Problem

What is expected to happen?

I would expect this plugin always to reflect the true network status of a mobile device, being notified when the status changes with its proper value

What does actually happen?

In general it works fine, but at some point I get stuck with a notification indicating that there's no network connection while the mobile device actual does have a connection. It's hard to reproduce, most time it works fine but on some occasions it doesn't. I subscribe to both onConnect and onDisconnect events.

This provides a really bad user experience since there are many web services that are not being called depending on the network status (some others are cached locally since I try to provide offline support and then sync to the server when connection is back online), like the login web service.

I'm not sure if I should rely entirely on this plugin anymore or if I'm doing something wrong. Does anyone had this behavior? I've seen it mostly on Android devices.

Thanks in advance!

Information

I subscribe to the provided events by the plugin on a service I use across the application, and when they are fired I check the network type just in case.... but to double check I set a timeout of 2 seconds and then re-check the current network type. Only then I change the status based on the type. If by some reason a subsequent event is fired I clear the timeout to prevent this with messing with the current network status from the last fired event

Command or Code

 public online: boolean;
 private notify;

 constructor(private _pf: Platform, private _nw: Network) {
    this.initNetwork();
 }

 public initNetwork(){
    this._pf.ready().then(() => {
        if (this._pf.is('cordova')) {
    this._nw.onDisconnect().subscribe(() => {
        console.log('now type... ', this._nw.type);
        this.clearNetworkNotification();
        this.notify = setTimeout(() => {
            console.log('just to be sure.. ', this._nw.type);
            if (this._nw.type.toLowerCase() === 'none') {
            console.log('we are offline!');
            this.online = false;
            }
        }, 2000);
    });
    this._nw.onConnect().subscribe(() => {
        console.log('now type... ', this._nw.type);
        this.clearNetworkNotification();
        this.notify = setTimeout(() => {
            console.log('just to be sure.. ', this._nw.type);
            if (this._nw.type.toLowerCase() !== 'none') {
                console.log('we are online!');
                this.online = true;
            }
        }, 2000);
    });
        }
    });
 }

 private clearNetworkNotification() {
    if (this.notify) {
        clearTimeout(this.notify);
        this.notify = undefined;
    }
 }

 public getNetworkStatus(){
    return this.online;
 }

Environment, Platform, Device

I'm building an Ionic 4 application in Angular 7 with cordova

Version information

Ionic:

   Ionic CLI                     : 5.2.2 (C:\Users\rodrigomartinezjr\AppData\Roaming\npm\node_modules\ionic)
   Ionic Framework               : @ionic/angular 4.8.1
   @angular-devkit/build-angular : 0.12.4
   @angular-devkit/schematics    : 7.2.1
   @angular/cli                  : 7.3.0
   @ionic/angular-toolkit        : 1.3.0

Cordova:

   Cordova CLI       : 8.1.2 (cordova-lib@8.1.1)
   Cordova Platforms : not available
   Cordova Plugins   : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 4.1.3, (and 16 other plugins)

Utility:

   cordova-res : 0.6.0 
   native-run  : 0.2.7 

System:

   NodeJS : v10.14.1 (C:\Program Files\nodejs\node.exe)
   npm    : 6.4.1
   OS     : Windows 10

code-push 2.0.6 "CodePushAcquisition"
cordova-android-support-gradle-release 3.0.0 "cordova-android-support-gradle-release"
cordova-plugin-code-push 1.11.17 "CodePush"
cordova-plugin-compat 1.2.0 "Compat"
cordova-plugin-device 2.0.2 "Device"
cordova-plugin-dialogs 2.0.1 "Notification"
cordova-plugin-file 4.3.3 "File"
cordova-plugin-file-transfer 1.6.3 "File Transfer"
cordova-plugin-geolocation 4.0.1 "Geolocation"
cordova-plugin-globalization 1.11.0 "Globalization"
cordova-plugin-googlemaps 2.5.3 "cordova-plugin-googlemaps"
cordova-plugin-ionic-keyboard 2.1.3 "cordova-plugin-ionic-keyboard"
cordova-plugin-ionic-webview 4.1.3 "cordova-plugin-ionic-webview"
cordova-plugin-network-information 2.0.1 "Network Information"
cordova-plugin-request-location-accuracy 2.2.3 "Request Location Accuracy"
cordova-plugin-splashscreen 5.0.2 "Splashscreen"
cordova-plugin-statusbar 2.4.2 "StatusBar"
cordova-plugin-whitelist 1.3.3 "Whitelist"
cordova-plugin-zip 3.1.0 "cordova-plugin-zip"
cordova-sqlite-storage 3.2.0 "Cordova sqlite storage plugin - cordova-sqlite-storage plugin version"
cordova.plugins.diagnostic 5.0.1 "Diagnostic"
im.ltdev.cordova.UserAgent 1.0.1 "User-Agent"

Checklist

• [x] I searched for existing GitHub issues
• [ ] I updated all Cordova tooling to most recent version
• [x] I included all the necessary information above

[GroupeBEL]

Hello, I have the same problem, is there any solution ? I'm testing on android device.

[PieterVanPoyer]

Hi

I've got 2 remarks: 1) You seem to be using version 2.0.1 of this plugin cordova-plugin-network-information 2.0.1 "Network Information" First try to update to version 2.0.2. That is the current version on npm.

2) In our company we do not rely on the 'offline' and 'online' events. In our project, we allways check the navigator.connection.type before every api call.

const networkState = navigator.connection.type; if (networkState === 'none') { console.log('We are offline'); } else { console.log('We are online'); }

Can any of these remarks help in solving your problem?

Kind regards, Pieter