Falsely reports `isInternetReachable` when type is "vpn"

Environment

System: OS: macOS 11.2.3 CPU: (12) x64 Intel® Core™ i7-9750H CPU @ 2.60GHz Memory: 975.16 MB / 32.00 GB Shell: 5.8 - /bin/zsh Binaries: Node: 12.19.0 - ~/.nvm/versions/node/v12.19.0/bin/node Yarn: 1.22.10 - /usr/local/bin/yarn npm: 7.6.3 - ~/.nvm/versions/node/v12.19.0/bin/npm Watchman: 4.9.0 - /usr/local/bin/watchman Managers: CocoaPods: 1.10.0 - /usr/local/bin/pod SDKs: iOS SDK: Platforms: iOS 14.4, DriverKit 20.2, macOS 11.1, tvOS 14.3, watchOS 7.2 Android SDK: API Levels: 23, 28, 29, 30 Build Tools: 28.0.3, 29.0.2, 30.0.2 System Images: android-29 | Google Play Intel x86 Atom, android-30 | Google APIs Intel x86 Atom, android-30 | Google Play Intel x86 Atom Android NDK: Not Found IDEs: Android Studio: 4.1 AI-201.8743.12.41.6953283 Xcode: 12.4/12D4e - /usr/bin/xcodebuild Languages: Java: 1.8.0_272 - /Library/Java/JavaVirtualMachines/adoptopenjdk-8.jdk/Contents/Home/bin/javac Python: 2.7.16 - /usr/bin/python npmPackages: @react-native-community/cli: Not Found react: 16.13.1 => 16.13.1 react-native: 0.63.4 => 0.63.4 react-native-macos: Not Found npmGlobalPackages: react-native: Not Found

Platforms

Android

Versions

• Android: 11 (RQ2A.210305.006)
• iOS: n/a
• react-native-netinfo: 6.0.0
• react-native: 0.63.4
• react: 16.13.1

Description

I’m using the netinfo event listener in order to display a “you are offline” banner in my application. I’m finding that on my Pixel 5, the package is falsely returning isInternetReachable as true with a type of “vpn”. I use Google Fi for my phone carrier, so my phone is always connected to the Google Fi VPN.

Reproducible Demo

It seems that you need to be connected to a VPN to reproduce. App.js:

  React.useEffect(() => {
    const unsubscribe = NetInfo.addEventListener((state) => {
      console.log(state)
      if (state.isInternetReachable) {
        setIsOffline(false);
      } else {
        setIsOffline(true);
      }
    });
    return () => unsubscribe();
  }, []);

When I disable mobile data and wifi, this is what is logged: {"details": {"isConnectionExpensive": true}, "isConnected": true, "isInternetReachable": true, "isWifiEnabled": false, "type": "vpn"}

[whenmoon]

I have just discovered this bug whilst using a Pixel 2 XL, Android 11, react-native-community/netinfo v6.0.0 and Nord VPN.

{"details": {"isConnectionExpensive": true}, "isConnected": true, "isInternetReachable": true, "isWifiEnabled": false, "type": "vpn"}

[Sachin926]

Hi @mikehardy as far as my findings go, this issue seems to be with the Android Network Capabilities API which seems to work fine with other networks but as soon as VPN is turned on, any change in the links, be it wifi or cellular, fires only ‘onCapabilitiesChanged’ event whose capabilities object always returns true whenever capabilities.hasCapability(NetworkCapabilities.NET_CAPABILITY_INTERNET) is called, so a simple solution could be overriding this check inside the updateAndSend method located inside ‘NetworkCallbackConnectivityReceiver.java’ whenever VPN is turned on.

One quick fix could be placing a check for capabilities.hasTransport(NetworkCapabilities.TRANSPORT_VPN) inside the updateAndSend method present inside NetworkCallbackConnectivityReceiver.java file and if it’s true, then perform another check to update the ‘isInternetReachable’ by checking the downLink bandwidth of the connection to be zero instead of ‘capabilities.hasCapability(NetworkCapabilities.NET_CAPABILITY_INTERNET)’, that is we’ll be checking if the downLink bandwidth of the connection is 0 whenever the Transport type is VPN, and if it’s zero then we’ll assume that the internet is not reachable.

Adding the following code inside ‘updateAndSend’ method might help -

 if (capabilities.hasTransport(NetworkCapabilities.TRANSPORT_VPN)) {

                isInternetReachable =capabilities.hasCapability(

                                NetworkCapabilities.NET_CAPABILITY_VALIDATED)

                                && !isInternetSuspended && capabilities.getLinkDownstreamBandwidthKbps() != 0;

            }

            else {

                isInternetReachable =

                        capabilities.hasCapability(NetworkCapabilities.NET_CAPABILITY_INTERNET)

                                && capabilities.hasCapability(

                                NetworkCapabilities.NET_CAPABILITY_VALIDATED)

                                && !isInternetSuspended;

            }