如何通过navigator.onLine与网络嗅探事件实现网页断网时自动触发逻辑熔断的机制？

本文共计784个文字，预计阅读时间需要4分钟。

不能仅依靠 `navigator.onLine` 做熔断，它仅反映系统接口状态，不是真实连通性判断依据。真正的自动熔断需结合事件监听、主动探测和状态收集，否则容易误熔断（如DNS故障时显示在线却无请求）或漏熔断（如路由器断网但onLine为true）。

用 online/offline 事件做快速状态捕获

这两个事件是熔断机制的触发入口，但要注意它们不冒泡、只在 window 上生效，且初始值不可信：

• 必须在页面加载后立即读取 navigator.onLine，手动判断初始状态是否需启动熔断逻辑
• 绑定监听时用 window.addEventListener('offline', handleOffline)，别绑在 document 或组件内部 DOM 上
• iOS Safari 后台标签页可能延迟触发，若业务强依赖实时性，需配合定时心跳兜底

用 fetch 探测实现“业务级”可用性验证

熔断依据不能是“有没有网”，而是“能不能调通关键接口”。