JavaScript通过navigator.onLine属性和online/offline事件检测网络状态,但仅反映浏览器连接认知而非真实可达性;需结合fetch探测等增强验证。

JavaScript 主要通过 navigator.onLine 属性和监听 online / offline 事件来检测网络状态,但它有局限性——只反映浏览器是否“认为”已连接到网络,不保证能访问服务器或互联网。
navigator.onLine 是一个只读布尔值,返回 true 表示浏览器认为在线(比如网线插着、Wi-Fi 已连),false 表示明确离线(如飞行模式开启、禁用所有网络适配器)。
注意:它不会发起真实请求验证网络可达性。例如,路由器断网但电脑仍连着 Wi-Fi,navigator.onLine 仍可能返回 true。
if (navigator.onLine) { /* 在线逻辑 */ }
console.log('初始状态:', navigator.onLine);
浏览器会在网络连接状态变化时触发全局事件,适合做实时响应:
立即学习“Java免费学习笔记(深入)”;
window.addEventListener('online', () => console.log('已联网'));window.addEventListener('offline', () => console.log('已断网'));这些事件在 Chrome、Firefox、Safari 和 Edge 中均支持,但触发时机略有差异(比如 Chrome 在系统级网络切换时才发,不是每次 DNS 失败都触发)。
为弥补 navigator.onLine 的不足,可配合轻量 HTTP 请求(如 GET 自己的健康检查接口或 /favicon.ico)确认服务可达性:
async function isActuallyOnline() {<br> try {<br> await fetch('/favicon.ico', { method: 'HEAD', cache: 'no-cache' });<br> return true;<br> } catch {<br> return false;<br> }<br>}true 后触发探测,避免频繁请求;失败时可重试 1–2 次再判定为不可用。不要仅依赖 navigator.onLine 做关键业务判断(如提交表单前校验)。真实场景中应结合:
NetworkError 或 TypeError(fetch 报错常见于断网)基本上就这些。不复杂但容易忽略细节,尤其是假阳性(onLine=true但实际不通)问题。
以上就是javascript怎样进行网络状态检测?_javascript中如何判断在线与离线?的详细内容,更多请关注php中文网其它相关文章!
java怎么学习?java怎么入门?java在哪学?java怎么学才快?不用担心,这里为大家提供了java速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号