React Native中NetInfo检测WiFi连接状态始终返回相同数据如何解决

NetInfo状态不更新排查方案 #

1. 平台权限配置缺失 #

NetInfo需要系统权限才能读取真实网络状态，未配置权限时只会返回静态默认值：

• Android端：在android/app/src/main/AndroidManifest.xml中添加权限声明

  <!-- 必加权限 -->
  <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
  <uses-permission android:name="android.permission.INTERNET" />
  

• iOS端：确认ios/[项目名]/Info.plist中未禁用网络访问权限，如有自定义ATS规则需确保连通性检测地址未被拦截。
• Expo项目：无需手动配置原生权限，但必须用expo install @react-native-community/netinfo命令安装适配版依赖，直接npm安装社区原版会出现兼容问题。

2. 依赖版本兼容问题 #

• React Native 0.60及以上版本已经移除内置的NetInfo模块，如果你调用的是react-native内置导出的NetInfo，会始终返回静态固定值，必须切换为社区维护的@react-native-community/netinfo包。
• 旧版本的社区NetInfo包存在多个状态不更新的已知bug，优先升级到最新稳定版即可修复。

3. 连通性检测配置异常 #

NetInfo的isConnected状态需要通过请求公共检测地址判断真实连通性，配置异常时会导致状态不更新：

• 如果你手动修改过NetInfo的全局配置，可先重置为默认配置验证：

  NetInfo.configure({
    reachabilityUrl: 'https://clients3.google.com/generate_204',
    reachabilityTest: async (response) => response.status === 204,
    reachabilityShortTimeout: 5 * 1000,
    reachabilityRequestTimeout: 15 * 1000,
  });
  

• 如果设备处于无法访问Google服务的网络环境，可以把reachabilityUrl替换为对应地区可访问的204地址即可。

4. 调试环境干扰 #

• 调试时如果开启了代理、VPN、热点共享，会干扰网络状态检测逻辑，断开相关网络工具后冷启动应用重试。
• 开发环境热重载不会重置NetInfo的监听实例，修改配置后必须完全关闭应用再重新启动生效。

你贴出的事件监听代码本身逻辑没有问题，完成上述排查后即可正常收到网络状态更新。

内容的提问来源于stack exchange，提问作者Bryl