ReactNative 网络库

  • What

JS判断网络状态不准确

  • react-native-netinfo在Android中的结构

type-CellularGeneration:G网模式枚举

type-ConnectionType:网络连接类型

AmazonFireDeviceConnectivityPoller:Amazon设备网络适配,可忽略

BroadcastReceiverConnectivityReceiver:Android7以下使用此网络监听

ConnectivityReceiver:网络监听抽象类

NetInfoModule:JS调用Java实现类

NetInfoPackage:JS调用Java方法及视图的注册包裹类

NetInfoUtils:工具类,wifi权限检查

NetworkCallbackConnectivityReceiver:Android7及以上网络监听

三、Android中isConnected()与isAvailable()区别

  1. isAvailable 属性指示设备是否可以访问任何网络(包括 Wi-Fi 或移动数据网络)。即使设备已连接到某个网络,也不一定意味着它可以访问互联网或其他资源。因此,isAvailable 属性只有在设备已经配置并且准备好发送和接收数据的情况下设置为 true。
  2. isConnected 属性指示设备是否已连接到任何网络(包括 Wi-Fi 或移动数据网络)。当设备成功连接到一个 Wi-Fi 热点或者使用运营商提供的移动数据连接时,该属性就会设置为 true。

|-------------------------|--------------------------------|
| 在WLAN设置界面状态 | 输出 |
| 显示连接已保存,但标题栏没有,即没有实质连接上 | 输出为:not connect, available |
| 显示连接已保存,标题栏也有已连接上的图标 | 输出为:connect, available |
| 选择不保存后 | 输出为:not connect, available |
| 选择连接,在正在获取IP地址时 | 输出为:not connect, not available |
| 连接上后 | 输出为:connect, available |

四、目前react-native-netinfo中7.0后使用NetworkCallbackConnectivityReceiver判断isInternetReachable有两个问题。

1)针对vpn网络连接方式,即使有网络也判定为无网,最新源码已修复,待同步更新

2)针对热点wifi,首次判断时,目前isInternetReachable是准确的,但是在分享热点的实际网络变更时,isInternetReachable判断是不一定准确(当无网变为有网准确,当有网变为无网不准确,此时即时无网,isInternetReachable\isAvailable\isConnected也返回true的状态)。

3)isInternetReachable值确认,分析需要判断不同方式的可用性以及网络延迟

总结:isInternetReachable在android原生,会存在无网返回true,有网返回false

通过设置useNativeReachability:false走js里的https:baidu.com,仅会存在无网时返回true的情况

解决方案:针对isInternetReachable使用连网方式不准确的场景,及时进行update操作。

  1. 海豚连接断开时update
  2. Http请求
相关推荐
️ 邪神1 个月前
【Android、IOS、Flutter、鸿蒙、ReactNative 】自定义View
flutter·ios·鸿蒙·reactnative·anroid
️ 邪神1 个月前
【Android、IOS、Flutter、鸿蒙、ReactNative 】启动页
android·flutter·ios·鸿蒙·reactnative
️ 邪神1 个月前
【Android、IOS、Flutter、鸿蒙、ReactNative 】水平布局
flutter·ios·鸿蒙·reactnative·anroid
️ 邪神1 个月前
【Android、IOS、Flutter、鸿蒙、ReactNative 】约束布局
android·flutter·ios·鸿蒙·reactnative
️ 邪神1 个月前
【Android、IOS、Flutter、鸿蒙、ReactNative 】文本点击事件
flutter·ios·鸿蒙·reactnative·anroid
️ 邪神1 个月前
【Android、IOS、Flutter、鸿蒙、ReactNative 】文本Text显示
flutter·ios·鸿蒙·reactnative·anroid
he_wen_jian4 个月前
Expo 开发ReactNative 后切换 eas 账号
rn·reactnative·expo
小菜做前端4 个月前
悬浮球 可拖拽-支持鼠标和触控
前端·reactjs·reactnative
yang2952423615 个月前
微软Edge浏览器全解析
reactnative
鹿屿二向箔5 个月前
React Native
reactnative