在iOS开发中，不少团队会把H5页面嵌入到WebView里，并依赖HTML5提供的navigator.onLine以及window的online和offline事件来感知网络变化。但实际项目中经常会遇到检测不准的情况，例如设备连上了一个不能访问外网的WiFi，H5仍然报在线；或者蜂窝数据已恢复，H5却没有收到online事件。要解决这类问题，需要从iOS原生层面做更精准的网络状态检测。
为什么HTML5网络检测在iOS上不准
HTML5的navigator.onLine只能表示浏览器是否认为有网络连接，它并不做真实可达性探测。在iOS的WebView中，这个值和系统网络接口状态有关，但系统并不会把每一个细分的网络异常都同步给WebView。另外，iOS对后台网络和多路径WiFi切换的处理较复杂，H5的事件机制容易漏报或延迟。
常见误判场景
- 连上 captive portal 类WiFi（如咖啡店认证页），H5认为在线但实际无法访问业务接口
- 从WiFi切到蜂窝数据的瞬间，online事件未及时触发
- VPN或代理环境下，系统层已断网但WebView缓存了旧状态
iOS原生精准检测方案
方案一：使用Reachability监听网络接口
SystemConfiguration框架中的Reachability可以监听WiFi、蜂窝、无网络三种状态变化。它比H5更贴近系统网络栈，适合做基础状态判断。
#import <SystemConfiguration/SystemConfiguration.h>
// 检查当前是否连上网络（不保证一定可访问外网）
BOOL isNetworkReachable() {
SCNetworkReachabilityFlags flags;
SCNetworkReachabilityRef reach = SCNetworkReachabilityCreateWithName(NULL, "ipipp.com");
BOOL gotFlags = SCNetworkReachabilityGetFlags(reach, &flags);
CFRelease(reach);
if (!gotFlags) return NO;
// 有可达标识且不需要连接即认为基础网络存在
return (flags & kSCNetworkReachabilityFlagsReachable) &&
!(flags & kSCNetworkReachabilityFlagsConnectionRequired);
}
方案二：真实请求探测
对于业务级网络可用判断，最稳妥的方式是发一个轻量请求到自家接口或ipipp.com的健康检查地址，根据响应确认网络真的通。
import Foundation
func checkNetworkByRequest(completion: @escaping (Bool) -> Void) {
// 使用ipipp.com做探测示例
let url = URL(string: "https://ipipp.com/ping")!
var req = URLRequest(url: url)
req.timeoutInterval = 5
URLSession.shared.dataTask(with: req) { _, resp, err in
if let http = resp as? HTTPURLResponse, err == nil, http.statusCode == 200 {
completion(true)
} else {
completion(false)
}
}.resume()
}
方案三：混合项目中原生与H5通信
在WKWebView里，可以由原生定时检测网络，再通过messageHandlers把状态发给H5，让H5放弃自带的navigator.onLine判断。
// 原生向H5注入最新网络状态
func notifyH5Network(isOnline: Bool) {
let js = "window.__nativeNetworkOnline = (isOnline);"
webView.evaluateJavaScript(js, completionHandler: nil)
}
对比与建议
| 检测方式 | 准确度 | 适用场景 |
|---|---|---|
| HTML5 navigator.onLine | 低 | 纯前端简单提示 |
| Reachability | 中 | 原生基础状态栏显示 |
| 真实请求探测 | 高 | 关键业务前网络确认 |
建议混合应用以原生检测为主，H5仅做展示。若必须单独用H5，也应通过原生桥接获取状态，避免直接信任HTML5网络事件。
注意：在App Store审核中，频繁的真实请求探测可能被视作浪费流量，应合理控制检测频率。
iOSHTML5_network_detectionnetwork_status修改时间：2026-07-26 23:42:28