java 断网处理_如何处理浏览器的断网情况？

好的断网处理会让人很舒适：lol的断线重连，王者荣耀的断线重连 可以确保游戏的继续进行

坏的断网处理甚至不处理会出bug：比如我手上的项目就出了个bug 业务人员表示非常苦恼

网络问题一直是一个很值得关注的问题。

比如在慢网情况下，增加loading避免重复发请求，使用promise顺序处理请求的返回结果，或者是增加一些友好的上传进度提示等等。

那么大家有没有想过断网情况下该怎么做呢？比如说网络正常->断网->网络正常。

其实我一直也没想过，直到组里的测试测出一个断网导致的bug，让我意识到重度依赖网络请求的前端，在断网情况下可能会出现严重的bug。

因此我将在这里记录一下自己对系统断网情况下的处理，一方面避免bug产生，一方面保证用户及时在应用内知道网络已经断开连接

概览

用于检测浏览器是否连网的navigator.onLine

断网事件"offline"和连网事件"online"

断网处理项目实战

思路和效果

断网处理组件使用

断网处理组件详情

发现

参考资料

概览

为了构建一个 “断网(offline)可用”的web应用，你需要知道应用在什么时候是断网(offline)的。

不仅仅要知道什么时候断网，更要知道什么时候网络恢复正常(online)。

可以分解陈本下面两种常见情况：

你需要知道用户何时online，这样你可以与服务器之间re-sync(重新同步)。

你需要知道用户何时offline，这样你可以将你未发出的请求过一段时间再向服务器发出。

通常可以通过online/offline事件去做这个事情。

用于检测浏览器是否连网的navigator.onLine

navigator.onLine

true online

false offline

可以通过network的online选项切换为offline，打印navigator.onLine验证。

当浏览器不能连接到网络时，这个属性会更新。规范中是这样定义的：

The navigator.onLine attribute must return false if the user agent will not contact the network when the user follows links or when a