<!doctype html>
<html>
<head>
<meta http-equiv=Content-Type content="text/html;charset=utf-8">
<title>js实现的网速测试方法</title>
</head>
<body>
<script>
function testBW(fn) {
var startTime, endTime, fileSize;
var xhr = new XMLHttpRequest();
xhr.timeout=30000;
xhr.onerror=function (){
console.log('onerror');
}
xhr.onreadystatechange =function(){
  console.log(JSON.stringify(xhr));
if(xhr.readyState === 2){
startTime = Date.now();
}
if (xhr.readyState === 4) {
endTime = Date.now();
console.log(xhr.readyState+'=='+xhr.responseText.length);
fileSize = xhr.responseText.length;
console.log(fileSize);
var speed = fileSize / ((endTime - startTime)/1000) / 1024;
fn && fn(Math.floor(speed)||0)
console.log('complete');
}
if(xhr.status === 200) {
endTime = Date.now();
console.log(xhr.readyState+'=='+xhr.responseText.length);
fileSize = xhr.responseText.length;
console.log(fileSize);
var speed = fileSize / ((endTime - startTime)/1000) / 1024;
fn && fn(Math.floor(speed)||0)
}
}
//http://wangsu3s.acc5.com/ping.jpg
//http://alyun3s.acc5.com/ping.jpg
//http://app-static.acc5.com/app/ping.gif
xhr.open("GET", "http://app-static.acc5.com/app/ping.gif?rnd=" + Math.random(), true);
xhr.send();
} function callback(speed){
document.write("<div id='div1'>"+speed + " KB/s</div>");
console.log(speed + " KB/s"); //215 KB/sec
}
testBW(callback); </script>
</body>
</html>

  

js 检测客户端网速的更多相关文章

  1. JS 检测客户端断网情况

    常用方法 1 navigator.onLine 2 window.addEventListener() 3 获取网络资源 4 ajax请求 1. navigator.onLine 只会在机器未连上路由 ...

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

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

  3. 2.1 实践篇:使用ping来检测网速

    1. Windows功能键+R ,打开cmd窗口 2. ping -n 200 www.baidu.com #ping网站www.baidu.com ,连续200次.验证连接. 可以ctrl+C 强制 ...

  4. 提升网速的路由器优化方法(UPnP、QoS、MTU、交换机模式、无线中继)

    在上一篇<为什么房间的 Wi-Fi 信号这么差>中,猫哥从微波炉.相对论.人存原理出发,介绍了影响 Wi-Fi 信号强弱的几大因素,接下来猫哥再给大家介绍几种不用升级带宽套餐也能提升网速的 ...

  5. JS判断客户端是否是iOS或者Android或者ipad(三)

     *  * @function: 判断浏览器类型是否是Safari.Firefox.ie.chrome浏览器  * @return: true或false  *  */ function isSafa ...

  6. H5案例分享:使用JS判断客户端、浏览器、操作系统类型

    使用JS判断客户端.浏览器.操作系统类型 一.JS判断客户端类型 JS判断客户端是否是iOS或者Android手机移动端 通过判断浏览器的userAgent,用正则来判断手机是否是ios和Androi ...

  7. Fiddler-010-网络延时应用小技巧-模拟低网速环境

    在日常的网络测试中,经常需要测试网络超时或在网络传输速率不佳的情况的应用场景,而与此同时我们有时手边资源有限,实现在各种真实网络(2G\3G)环境下测试有些局限性.其实 fiddler 已经提供了类似 ...

  8. Linux下使用Speedtest测试网速

    导读 Speedtest是用来测试网络性能的开源软件,在Linux下面安装Speedtest可以用来测试网络出口的上传和下载速度,帮助排查网络方面导致的故障. Speedtest介绍 由于公司几个项目 ...

  9. 基于gulp编写的一个简单实用的前端开发环境好了,安装完Gulp后,接下来是你大展身手的时候了,在你自己的电脑上面随便哪个地方建一个目录,打开命令行,然后进入创建好的目录里面,开始撸代码,关于生成的json文件请点击这里https://docs.npmjs.com/files/package.json,打开的速度看你的网速了注意:以下是为了演示 ,我建的一个目录结构,你自己可以根据项目需求自己建目

    自从Node.js出现以来,基于其的前端开发的工具框架也越来越多了,从Grunt到Gulp再到现在很火的WebPack,所有的这些新的东西的出现都极大的解放了我们在前端领域的开发,作为一个在前端领域里 ...

随机推荐

  1. C#原生加密方法: System.Security.Cryptography.CryptoStream DataSet加密解密

    采用16位密钥形式加密,把数据 dataset或文本转换为二进制流,然后进行加密解密.代码如下: using System; using System.Collections.Generic; usi ...

  2. uva 1149:Bin Packing(贪心)

    题意:给定N物品的重量,背包容量M,一个背包最多放两个东西.问至少多少个背包. 思路:贪心,最大的和最小的放.如果这样都不行,那最大的一定孤独终生.否则,相伴而行. 代码: #include < ...

  3. 关于 gstreamer 和 webrtc 的结合,有点小突破

    今天让我找到了 gstreamer 的一个牛叉的杀手锏,脑海中马上想到了一个大致的框架和方案计划,用 gst-inspector 先进行对象自省属性探测,然后祭出 gst-launcher 大刀进行管 ...

  4. Android与H5互调

    前言 微信,微博,微商,QQ空间,大量的软件使用内嵌了H5,这个时候就需要了解Android如何更H5交互的了:有些外包公司,为了节约成本,采用Android内嵌H5模式开发,便于在IOS上直接复用页 ...

  5. Codeforces 912D Fishes (概率&期望,优先队列的应用)

    题目链接 Fishes 题意  在一个$n*m$的矩阵中,随机选择一个$r * r$的区域覆盖. 一开始我们可以在这个$n*m$的矩阵中选择$k$个点标记为$1$. 我们要选择一个最佳的标记策略,使得 ...

  6. Codechef Chef and Triangles(离散化+区间并集)

    题目链接 Chef and Triangles 先排序,然后得到$m - 1$个区间: $(a[2] - a[1], a[2] + a[1])$ $(a[3] - a[2], a[3] + a[2]) ...

  7. 透过ReentrantLock窥探AQS

    背景 JDK1.5引入的并发包提供了一系列支持中等并发的类,这些组件是一系列的同步器,几乎任一同步器都可以实现其他形式的同步器,例如,可以用可重入锁实现信号量或者用信号量实现可重入锁.但是,这样做带来 ...

  8. 某考试 T2 Tree

    2 树 2.1 题目描述 给一棵n 个节点的树,节点分别编号为0 到n - 1.你可以通过如下的操作来修改这棵树:首先先删去树上的一条边,此时树会分裂为两个连通块,然后在两个连通块之间加上一条新的边使 ...

  9. [转] 使用SVN进行源码管理

    原文地址:gyzhao's, 使用SVN进行源码管理(下) 软件下载 1. Viusal SVN, Download(官网),安装该软件之前,请先安装TortoiseSVN,Download. 2. ...

  10. Docker 容器网络

    默认网络 当安装docker时,它会自动创建3个网络.可以使用docker network ls 来查看.   zane@zane-V:~$ docker network ls NETWORK ID ...