React Native后台/锁屏后NetInfo返回isConnected为false问题咨询

• 调整NetInfo.fetch调用逻辑，跳过缓存

@react-native-community/netinfo v7.x版本默认会缓存网络状态，Android设备在应用后台/锁屏期间会限制网络状态广播更新，切回前台时fetch默认读取旧缓存会导致结果错误。调用fetch时传入force参数强制刷新状态即可解决该问题：

const fetchConnection = () => {
  // 第二个参数设为true强制跳过缓存，拉取最新网络状态
  NetInfo.fetch(undefined, true).then((state: any) => {
    setShow(!(state.isConnected && state.isInternetReachable));
  });
};

• 监听应用前后台切换事件，切前台时主动刷新网络状态

原代码仅在应用初始化时执行一次fetch，没有监听应用从后台切回前台的事件，需要引入React Native内置的AppState模块监听状态变化，切前台时主动触发网络状态刷新：

import { AppState } from 'react-native'
import NetInfo from "@react-native-community/netinfo";

// ...原有其他代码
const netInfo = useNetInfo();
const [show, setShow] = useState(false);

useEffect(() => {
  setShow(!(netInfo.isConnected && netInfo.isInternetReachable));
}, [netInfo]);

useEffect(() => {
  fetchConnection();
  // 监听应用状态变化
  const subscription = AppState.addEventListener('change', nextAppState => {
    if (nextAppState === 'active') {
      fetchConnection();
    }
  });

  return () => {
    subscription.remove();
  };
}, []);

const fetchConnection = () => {
  NetInfo.fetch(undefined, true).then((state: any) => {
    setShow(!(state.isConnected && state.isInternetReachable));
  });
};

• 确认Android权限和库配置

检查Android项目的AndroidManifest.xml文件中是否已添加必要权限：
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
如果业务需要准确判断互联网可达性，可通过NetInfo.configure调整可达性检测配置，避免默认检测地址不可用导致误判，同时可以直接禁用状态缓存避免旧值干扰：

// 可在应用入口文件全局配置
NetInfo.configure({
  reachabilityUrl: 'https://clients3.google.com/generate_204',
  reachabilityTest: async (response) => response.status === 204,
  reachabilityShortTimeout: 5 * 1000,
  cacheExpirationTime: 0, // 禁用状态缓存
})

• 版本兼容优化

v7.1.2版本存在已知的Android后台状态同步bug，如果以上方案仍未解决，可将包版本升级到^8.3.0，该版本修复了大量Android平台状态同步异常问题，且API完全兼容7.x版本的用法。

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