body上的ononline属性无效，因该事件仅window原生支持；须用addeventlistener监听并配合navigator.online初始检测，online后需健康检查而非直接重试。
body 标签上的 ononline 属性根本不会工作——它只是被浏览器忽略，不报错、不触发、不执行。
为什么 body ononline 无效
HTML 规范明确限定 online 和 offline 事件只在 window 对象上原生支持。body 不是合法事件目标，写 等同于没写。所有现代浏览器（Chrome/Firefox/Safari/Edge）均如此，不是兼容性问题，而是标准行为。
window.addEventListener('online') 必须配合 navigator.onLine 初始检测
事件只在状态“变化时”触发，页面加载完成时不会补发。如果用户打开页面时已断网，online 事件永远不会来，但 navigator.onLine 已为 false。
- 必须在
DOMContentLoaded或 React 的useEffect(() => {}, [])中立即读取navigator.onLine做初始 UI 渲染 - 紧接着调用
window.addEventListener('online', handler)和window.addEventListener('offline', handler) - 单页应用（SPA）中，组件卸载或路由离开时，务必手动调用
removeEventListener，否则可能重复绑定、内存泄漏
收到 online 事件后不能直接重发请求
navigator.onLine === true 只表示操作系统报告“有网络”，不代表你的 API 可达。常见失效场景包括：
- 连了 WiFi 但光猫断网 →
fetch('/api')立刻超时 - DNS 污染或代理配置错误 → 所有请求卡住
- 移动端锁屏后 WebSocket 断连，
navigator.onLine仍为true，但连接已死
正确做法：在 online 回调里发起一次轻量健康检查，例如 fetch('/health', { method: 'HEAD', signal: AbortSignal.timeout(2000) })，仅当返回 2xx 才标记服务可用，再启动重试队列。
测试必须用 DevTools 的 Offline 模拟
拔网线、关 WiFi 在多网卡、虚拟机、企业网络环境下经常不改变 navigator.onLine 值；手机飞行模式也可能被系统缓存。唯一可靠方式是 Chrome/Firefox DevTools Network 面板勾选 Offline，它会强制修改底层网络栈状态并触发事件。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
