Ionic: How to detect connected to internet with no access


#1

Hi,
I am developing an app and i just want to check network connectivity.but it only detects that device is connected to internet or not.it should also detect if there no internet access.

Code :
1-my provider

export class ConnectivityService {

  onDevice: boolean;

  constructor(public platform: Platform, public alertCtrl: AlertController) {
    this.onDevice = this.platform.is('cordova');
  }

  isOnline(): boolean {
    if (this.onDevice && Network.type) {
      return Network.type !== Connection.NONE;
    } else {
      return navigator.onLine;
    }
  }

  isOffline(): boolean {
    if (this.onDevice && Network.type) {
      return Network.type === Connection.NONE;
    } else {
      return !navigator.onLine;
    }
  }

}

2-component

export class Demo {
private internetStatus: boolean = false;
  constructor(public connectivityService: ConnectivityService) {

    this.checkInternetConnection();
  }
  checkInternetConnection() {
    this.addConnectivityListeners();
    if (this.connectivityService.isOffline()) {
      this.internetStatus = true;
    } 
  }
  addConnectivityListeners() {
    let onOnline = () => {
      this.internetStatus = false;
    };
    let onOffline = () => {
      this.internetStatus = true;
    };
    document.addEventListener('online', onOnline, false);
    document.addEventListener('offline', onOffline, false);
  }  
}

Ionic info:

Cordova CLI: 6.5.0
Ionic Framework Version: 2.0.1
Ionic CLI Version: 2.2.2
Ionic App Lib Version: 2.2.1
Ionic App Scripts Version: 1.0.0
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Linux 4.4
Node Version: v7.5.0
Xcode version: Not installed


Unable to find network status
#2

What is the difference between these two things?


#3

Device is just connected to internet but there no access due to some technical problem.


#4

I’m sorry, but I can’t make any sense out of this. The internet isn’t a concrete thing. If you are interested in knowing whether your device can connect to a particular host, try connecting to it. If it works, it works. If it didn’t, it didn’t.


#5

In my application before displaying data to user.i need to check that device is connected to network or not.

Note-sometime it happens that we are connected to the network but if you try to search something on browser it says “Something went wrong please check you connection and try again”.
Maybe your ISP deactivate you account,therefore you can’t browse anything .Again keep in you are connected to network using (wifi router,lan cable,etc)

Scenario:
Let device is connected to network,But it can’t access/browse anything.
So,it should give me alert "Please check your internet connection ".
But it not displays any alert in this case.


#6

That’s your solution. The error message in browser only appears after trying to connect to a website and failing. Without doing that, your app can’t know that it does have a network connection, but it is broken.


#7

The only solution which comes to my mind is to have a really dummy backend function in your API, that return true just for calling it.

So you check if your mobile have internet connection via the Network provider, then if success, call your dummy API service (the most simplest call you can make, a GET API call to http://yourdomain.com/checkconnection for example) and if this call is success, then your device is really connect to internet.


#8

The correct way to do this is to use Ionic Native Plugin:


#9

Have you got any better solution ??


#10

but it is not working when the device is already connected or not.

It gives network only on events such as onConnect, onDisconnect, onChange
but need a way to find whether the device is already connected or not.

Any correct way to know the device has internet connection or not ???


#11

Have you got any better solution???


#12

this way working for me

isOnline(): boolean {
return navigator.onLine;
}

isOffline(): boolean {
return !navigator.onLine;
}


#13

Working for me. Thanks