[HTML] HTML简单实现网络测速

最新推荐文章于 2024-05-29 21:36:25 发布

吥_悔

最新推荐文章于 2024-05-29 21:36:25 发布

阅读量5.5k

点赞数 2

分类专栏： HTTP JavaScript 文章标签：网络服务器 html 源码带宽

本文链接：https://blog.csdn.net/qq_14852397/article/details/71794649

版权

JavaScript 同时被 2 个专栏收录

5 篇文章 0 订阅

订阅专栏

HTTP

3 篇文章 0 订阅

订阅专栏

1. 简单实现网络测速：

实现原理：通过系统服务器上的图片，来计算出当前访问服务的带宽；

注：准确性就不好说了，做此功能也只是想简单的显示给用户参考，请求的系统服务器的当前带宽！

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title> 网络测速 </title>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<meta name="Generator" content="EditPlus">
		<meta name="Author" content="xinmingyang">
		<meta name="Keywords" content="">
		<meta name="Description" content="">
	</head>

	<body>
		<!--<div>
			单位换算：宽带512kbps=64kb/s - 1M=128kb/s - 2M=256kb/s
		</div>-->
		<div id="box"></div>
	</body>
	
	<script>
		setInterval("getSpeed()", 1000);
		
		function getSpeed(){
			var startTime = new Date().getTime();
			var img = new Image();
			img.src = "http://127.0.0.1:80/web/resources/img/bandwidth.jpg?timeStamp=" + startTime;
			img.onload = function(){
				// 图片大小
				var size = 204.94 * 1000;
				var endTime = new Date().getTime();
				var speed = parseInt(size / (endTime - startTime));
				var unit = "KB/S";
				if(speed >= 1024){
					speed = (speed / 1024).toFixed(2);
					unit = "MB/S";
				}
				document.getElementById("box").innerHTML = "当前带宽："+ speed + unit + "<br/>请求用时：" + (endTime - startTime) / 1000 + "s";
			};
		}
	</script>
</html>

吥_悔

关注

2
点赞
踩
2

收藏

觉得还不错? 一键收藏
1
评论
[HTML] HTML简单实现网络测速

1. 简单实现网络测速：注：准确性就不好说了，做此功能也只是想简单的显示给用户参考，请求的系统服务器的当前带宽！网络测速单位换算：宽带512kbps=64kb/s - 1M=128kb/s - 2M=256kb/s --> setInterval("getSpeed()", 1000);
复制链接

扫一扫