Javascript实现网络监测的方法
网络编程 2021-07-04 21:48www.168986.cn编程入门
这篇文章主要介绍了Javascript实现网络监测的方法,可实现检测网络连接及网速的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下
本文实例讲述了Javascript实现网络监测的方法。分享给大家供大家参考。具体实现方法如下
该代码可监测网络是否连接及网速的快慢状态。
(function(){ var work = function(){ var monitor = this; / @param {Funcation} speedInterval / var speedInterval = null; / @param {Function} workInterval / var workInterval = null; / @param {Function} reNetworkInterval / var reNetworkInterval = null; var time = 5000; / 获取网络连接状态 / var getConnectState = function(){ return navigator.onLine ? 1 : 0; }; / 网络中断 / var disconnect = function(){ // TODO ... console.log("网速中断"); window.clearInterval(reNetworkInterval); reNetworkInterval = null; endSpeed(); endNetwork(); window.setTimeout(function(){ reNetworkInterval = window.setInterval(function(){ if (getConnectState() == 1) { window.clearInterval(reNetworkInterval); reNetworkInterval = null; startSpeed(); startNetwork(); } else { window.clearInterval(reNetworkInterval); reNetworkInterval = null; disconnect(); } }, time); }, 2 time); }; / 网络速度 / var speed = { / 网速过慢 / bad : function(){ // TODO ... console.log("网速过慢"); window.setTimeout(function(){ if(getConnectState() == 1) { window.clearInterval(workInterval); workInterval = null; startSpeed(); } else { disconnect(); } }, 2 time); }, / 网速中等 / medium : function(){ // TODO ... console.log("网速中等"); }, / 网速极佳 / great : function(){ // TODO ... console.log("网速极佳"); } }; / 开启速度监测 @private / var startSpeed = function(){ window.clearInterval(speedInterval); speedInterval = null; if(getConnectState() == 1) { speedInterval = window.setInterval(function(){ var start = new Date().getTime(); if (getConnectState() == 1) { var img = document.getElementById("workSpeedImage"); if (!!!img) { img = document.createElement("IMG"); img.id = "workSpeedImage"; img.style.display = "none"; document.body.appendChild(img); } try { img.src = "http://.baidu./img/baidu_jgylogo3.gif?_t=" + new Date().getTime(); img.onload = function(){ var end = new Date().getTime(); var delta = end - start; if (delta > 200) { speed.bad(); } else if (delta > 100) { speed.medium(); } else { speed.great(); } }; } catch(e){ speed.bad(); } } else { // TODO 网络断开 disconnect(); } }, time); }else { // TODO 网络断开 disconnect(); } }; / 停止速度监测 @private / var endSpeed = function(){ window.clearInterval(speedInterval); speedInterval = null; }; / 开启网络连接监测 @private / var startNetwork = function(){ if (getConnectState() == 1) { workInterval = window.setInterval(function(){ if (getConnectState() == 0) { disconnect(); } }, time); } else{ disconnect(); } }; / 结束网络连接监测 @private / var endNetwork = function(){ window.clearInterval(workInterval); workInterval = null; }; / 网络监控开始 / this.start = function(){ startNetwork(); startSpeed(); }; / 停止网络监控 / this.s = function(){ endSpeed(); endNetwork(); }; }; window.work = new work(); }).call(this); // 调用的时候,直接调用work.start();
希望本文所述对大家的javascript程序设计有所帮助。
上一篇:javascript文本模板用法实例
下一篇:jquery模拟alert的弹窗插件
编程语言
- 如何快速学会编程 如何快速学会ug编程
- 免费学编程的app 推荐12个免费学编程的好网站
- 电脑怎么编程:电脑怎么编程网咯游戏菜单图标
- 如何写代码新手教学 如何写代码新手教学手机
- 基础编程入门教程视频 基础编程入门教程视频华
- 编程演示:编程演示浦丰投针过程
- 乐高编程加盟 乐高积木编程加盟
- 跟我学plc编程 plc编程自学入门视频教程
- ug编程成航林总 ug编程实战视频
- 孩子学编程的好处和坏处
- 初学者学编程该从哪里开始 新手学编程从哪里入
- 慢走丝编程 慢走丝编程难学吗
- 国内十强少儿编程机构 中国少儿编程机构十强有
- 成人计算机速成培训班 成人计算机速成培训班办
- 孩子学编程网上课程哪家好 儿童学编程比较好的
- 代码编程教学入门软件 代码编程教程