常用方法

  • 1 navigator.onLine
  • 2 window.addEventListener()
  • 3 获取网络资源
  • 4 ajax请求

1. navigator.onLine

只会在机器未连上路由或者局域网才返回false;也就是连上路由,断网的情况也是返回true

if (navigator.onLine) {
console.log('网络已连接');
} else {
console.log('已断网');
}

2. window.addEventListener()

这个方法会有一个很隐蔽的bug。 电脑有个虚拟机桥接的网卡,就算拔掉网线浏览器也认为你是有网; 此时应该把电脑的以太网vm 禁用掉

window.addEventListener('online', function() {
console.log('网络已连接');
});
window.addEventListener('offline', function() {
console.log('已断网');
});

3 获取网络资源 (利用IMG的onerror事件)

通过轮询生成 IMG 通过 img 的 onerror 事件判断是否断网,此方法弱点就是耗流量(一像素的空gif 轮询一次 1.43KB

setInterval(function(){
var $img = $('<img src="http://jslite.io/blank.gif?'+(new Date())+'">')
$img.appendTo('body').css("display","none").load(function(){
console.log("连接成功!")
$(this).remove()
}).error(function(){
console.log("断网了!")
$(this).remove()
})
},2000)

4 ajax请求轮询

缺点也是耗资源

setInterval(function(){
//Ajax...
},1000)

JS 检测客户端断网情况的更多相关文章

  1. Python离线断网情况下安装numpy、pandas和matplotlib等常用第三方包

    联网情况下在命令终端CMD中输入“pip install numpy”即可自动安装,pandas和matplotlib同理一样方法进行自动安装. 工作的电脑不能上外网,所以不能通过直接输入pip命令来 ...

  2. struts项目部署在Tomca上在断网情况下启动报错

    转载请注明出处:http://www.cnblogs.com/Joanna-Yan/p/6015693.html 前段时间,项目部署到现场后,反馈Tomcat能正常启动,但是项目有时访问不了也不报错. ...

  3. 【转载】struts应用在断网情况下启动报错解决办法(java/net/AbstractPlainSocketImpl.java:178:-1)

    无意间struts应用在有网络的情况下启动正常,在断网的情况下启动报错,报错代码如下图所示: SEVERE: Exception starting filter struts2 Class: java ...

  4. js 检测客户端网速

    <!doctype html> <html> <head> <meta http-equiv=Content-Type content="text/ ...

  5. js检测客户端是否安装

    前言 需求背景:一个web下载页面,需要检测pc是否安装了客户端软件(windows软件).网页上有一个打开客户端按钮.若安装了客户端软件,则直接打开,否则下载软件.支持web下载页面在iframe下 ...

  6. CentOS 6.5本地yum源、局域网离线yum仓库(断网情况下轻松安装各种依赖包)

    在工作中, 公司的服务器大部分都禁止连接外网的,初始化系统,测试某些产品时,往往缺一些软件或依赖包,一个个上传到机器,如此浪费时间,浪费金钱,en...yum能够自动查找并解决rpm包之间的依赖关系, ...

  7. 心跳机制tcp keepalive的讨论、应用及“断网”、"断电"检测的C代码实现(Windows环境下)

    版权声明:本文为博主原创文章,转载时请务必注明本文地址, 禁止用于任何商业用途, 否则会用法律维权. https://blog.csdn.net/stpeace/article/details/441 ...

  8. Delphi之TClientSocket和TServerSocket使用tcp keepalive心跳机制实现“断网”、"断电"检测

    开发环境:Delphi7 测试环境:WinXP,Win7  32bit,Win7 64bit 使用TClientSocket和TServerSocket实现TCP长连接通讯,经常因为断电断网等原因导致 ...

  9. h5 网络断网时,返回上一个页面 demo (与检测网络代码相结合,更直观看到结果)

    页面一: <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8& ...

随机推荐

  1. EasyUI使用DataGrid向服务器传参

    由于DataGrid自带有Post方式,使用Url可以向指定的地址Post数据,所以从这方面来看和Jquery的Ajax非常像(我想应该就是使用的Ajax,不过没有深入研究过Easyui的源代码).但 ...

  2. Bootstrap-tagsinput标系统使用心得

    最近工作中由于需求使用到了Bootstrap-tagsinput标系统,我的需求是: 1)能够从后台数据库获取标签信息展示到前端页面: 2)能够实现输入标签添加到后台,并ajax刷新页面: 3)能够实 ...

  3. 虚拟机中安装 centOS,本地安装 SSH 连接 - 02

    先进入 centOS 中,查询虚拟机的 IP 地址: 双击打开 SSH 可视化客户端: 点击 Connect 需要输入之前那个[无论如何都要使用]的密码. 密码在[centOS - 01]里面设置过, ...

  4. idea 复制数据库查询结果,粘贴直接生成insert into 语句

    遇到一个场景,需要将数据库查询的结果导入到另外一个数据库中,给我的第一感受是,写程序,从数据库A中获取到数据,在插入到数据库B中. 但是Idea 可以直接复制查询结果,然后粘贴生成insert语句. ...

  5. HDU 4767——Bell

    昨天比赛被虐的这个题目. 今天听斌牛讲过他的思路后就A掉了. 题目的意思是要你求出bell数的第n项对95041567取模. 首先,95041567=31*37*41*43*47: 然后取模就是先分别 ...

  6. Qt中父子widget的事件传递

    以前我一直以为:在父widget上摆一个子widget后,当click子widget时:只会进入到子widget的相关事件处理函数中,比如进入到mousePressEvent()中, 而不会进入到父w ...

  7. 3.7 TCP拥塞控制

    3.7 TCP拥塞控制 在3.5.5流量控制中有,接收方通过维护一个rwnd来控制流量,本节中考虑三个问题: 第一,  一个TCP发送方如何限制它向其他连接发送流量的速率. 第二,  一个TCP发送方 ...

  8. 【刷题】洛谷 P3808 【模板】AC自动机(简单版)

    题目背景 这是一道简单的AC自动机模板题. 用于检测正确性以及算法常数. 为了防止卡OJ,在保证正确的基础上只有两组数据,请不要恶意提交. 管理员提示:本题数据内有重复的单词,且重复单词应该计算多次, ...

  9. [CF1111C]Creative Snap

    题目大意:有一个长度为$2^n(n\leqslant30)$的格子,有$k(k\leqslant10^5)$个球,分布在这些格子中,有两种消灭格子的方法: 1. 若一段格子长度大于等于$2$,可以对半 ...

  10. 【JavaScript】面向对象的程序设计

    一.前言        接着上一篇的内容,继续JavaScript的学习. 二.内容 属性类型 //数据属性[Configurable] —— 能否通过delete删除属性从而重新定义属性,能否修改属 ...