react-native-wifi-reborn

This package requires custom native code and cannot be used in the standard 'Expo Go' app. To use it with Expo, add the react-native-wifi-reborn plugin to your app.json or app.config.js:

{
  "expo": {
    "ios": {
      "infoPlist": {
        "NSLocalNetworkUsageDescription": "The app requires access to the local network so it can..."
      }
    },
    "plugins": ["react-native-wifi-reborn"]
  }
}

Plugin Props:

• fineLocationPermission (false | undefined): If set to false, android.permission.ACCESS_FINE_LOCATION will not be added to the AndroidManifest.xml.

{
  "plugins": [
    [
      "react-native-wifi-reborn",
      {
        "fineLocationPermission": false
      }
    ]
  ]
}

To use react-native-wifi-reborn on iOS, you must complete the following steps:

1. Permissions: Add NSLocalNetworkUsageDescription to your Info.plist to allow joining other networks.
2. Capabilities: In Xcode, under your project settings, add the following capabilities via '+ Capability':
   • Access WIFI Information (required to access Wi-Fi information)
   • Hotspot Configuration (required to connect to networks)
3. iOS 13+ Location Permissions: You must include either Privacy - Location When In Use Usage Description or Privacy - Location Always and When In Use Usage Description in your Info.plist settings.

When commissioning IoT devices that do not provide internet access, you can use forceWifiUsageWithOptions to route all app network requests through the Wi-Fi network instead of the mobile connection.

Warning: You must disable this setting after use. Even if the app disconnects from the Wi-Fi network, it will continue to attempt routing all traffic through Wi-Fi if this is not turned off.

Method

forceWifiUsageWithOptions(useWifi: boolean, options: Record<string, unknown>): Promise<void>

Options

• noInternet: Boolean. Set to true to indicate the Wi-Fi network does not have internet connectivity.

// Example: Routing traffic to an IoT device without internet
await WifiManager.forceWifiUsageWithOptions(true, { noInternet: true });

// IMPORTANT: Disable after use
await WifiManager.forceWifiUsageWithOptions(false, {});

After modifying code (e.g., in App.tsx), you can reload the app to apply changes without a full rebuild:

• Android: Press the <kbd>R</kbd> key twice or open the Developer Menu (<kbd>Ctrl</kbd> + <kbd>M</kbd> on Windows/Linux, or <kbd>Cmd ⌘</kbd> + <kbd>M</kbd> on macOS) and select "Reload".
• iOS: Press <kbd>Cmd ⌘</kbd> + <kbd>R</kbd> in the iOS Simulator.

To run the provided example project, you must first ensure your React Native environment is set up. The process involves starting the Metro bundler and then launching the application on your target platform (Android or iOS).

1. Start the Metro Server

Run this from the root of the project to start the JavaScript bundler:

npm start
# OR
yarn start

2. Launch the Application

Open a new terminal and run the command for your desired platform:

For Android:

npm run android
# OR
yarn android

For iOS:

npm run ios
# OR
yarn ios

For Android 6 and above, you must request the ACCESS_FINE_LOCATION permission at runtime to enable Wi-Fi scanning and management. You can use PermissionsAndroid from react-native to handle this.

import { PermissionsAndroid } from 'react-native';

const granted = await PermissionsAndroid.request(
  PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION,
  {
    title: 'Location permission is required for WiFi connections',
    message: 'This app needs location permission as this is required to scan for wifi networks.',
    buttonNegative: 'DENY',
    buttonPositive: 'ALLOW',
  },
);
if (granted === PermissionsAndroid.RESULTS.GRANTED) {
  // You can now use react-native-wifi-reborn
} else {
  // Permission denied
}

Install the package using npm:

$ npm install react-native-wifi-reborn

Note: This library is autolinked for React Native 60+. For versions 0.59 and below, manual linking is required.

Use isEnabled() to check the current state of the device's Wi-Fi and setEnabled() to toggle it.

Note: On Android 6+, these operations may require location permissions and for location services to be enabled.

// Check if Wi-Fi is enabled
const enabled = await WifiManager.isEnabled();
this.setState({wifiIsEnabled: enabled});

// Set Wi-Fi ON
WifiManager.setEnabled(true);

// Set Wi-Fi OFF
WifiManager.setEnabled(false);

Use getCurrentWifiSSID() to retrieve the SSID of the currently connected Wi-Fi network. This method returns a Promise.

Errors:

• couldNotDetectSSID: Occurs if the device is not connected or is in the process of connecting.

import WifiManager from "react-native-wifi-reborn";

try {
  const currentSSID = await WifiManager.getCurrentWifiSSID();
  console.log(`Your current Wi-Fi SSID is ${currentSSID}`);
} catch (error) {
  console.log("Cannot get current SSID!");
}