speedtest-x脚本优化

在搭建speedtest服务器时，用宝塔面板搭配speedtest-x源代码，搭建好后能测试，然后根据自己的一些工作需求，做一些小改动和优化，优化内容如下：

修改report.php文件，

源代码无法统计测速结果，是因为每次的测试结果都把之前的测试结果覆盖，可以修改/www/wwwroot/speedtest-x-master/backend/文件夹下面的report.php文件修改后的代码如下

php 复制代码

<?php

require_once "./SleekDB/SleekDB.php";
require_once "./config.php";

function maskLastSegment($ip) {
    $ipaddr = inet_pton($ip);
    if (strlen($ipaddr) == 4) {
        $ipaddr[3] = chr(0);
    } elseif (strlen($ipaddr) == 16) {
        $ipaddr[14] = chr(0);
        $ipaddr[15] = chr(0);
    } else {
        return "";
    }
    return rtrim(inet_ntop($ipaddr),"0")."*";
}

$store = \SleekDB\SleekDB::store('speedlogs', './',[
    'auto_cache' => false,
    'timeout' => 120
]);

$reportData = [
    "key" => sha1(filter_var($_POST['key'], FILTER_SANITIZE_STRING)),
    "ip" => maskLastSegment(filter_var($_POST['ip'], FILTER_SANITIZE_STRING)),
    "isp" => filter_var($_POST['isp'], FILTER_SANITIZE_STRING),
    "addr" => filter_var($_POST['addr'], FILTER_SANITIZE_STRING),
    "dspeed" => (double) filter_var($_POST['dspeed'], FILTER_SANITIZE_STRING),
    "uspeed" => (double) filter_var($_POST['uspeed'], FILTER_SANITIZE_STRING),
    "ping" => (double) filter_var($_POST['ping'], FILTER_SANITIZE_STRING),
    "jitter" => (double) filter_var($_POST['jitter'], FILTER_SANITIZE_STRING),
    "created" => date('Y-m-d H:i:s', time()),
];

if (empty($reportData['ip'])) exit;
$results = $store->insert($reportData);
$MAX_LOG_COUNT = defined('MAX_LOG_COUNT') ? MAX_LOG_COUNT : 100;
if ($results['_id'] > $MAX_LOG_COUNT) {
    $store->where('_id', '=', $results['_id'] - $MAX_LOG_COUNT)->delete();
}

结果验证：每次测试完成查看 backend/SleekDB/speedlogs/data/ 目录是否会新增一个json文件，内容是本次测试的最终结果。

修改index.html,

修改了report.php文件后，测试结果还达不到预期效果，需要在测试结束时才提交测试结果且不能清空当前测试页面的测试结果，代码如下：

html 复制代码

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, user-scalable=no" />
<title>speedtest-x</title>
<link rel="shortcut icon" href="favicon.ico">
<script type="text/javascript" src="speedtest.js"></script>
<script type="text/javascript">

//INITIALIZE SPEEDTEST
var s=new Speedtest(); //create speedtest object
var url_report='./backend/report.php';
s.onupdate=function(data){ //callback to update data in UI
    I("ip").textContent=data.clientIp;
    I("dlText").textContent=(data.testState==1&&data.dlStatus==0)?"...":data.dlStatus;
    I("ulText").textContent=(data.testState==3&&data.ulStatus==0)?"...":data.ulStatus;
    I("pingText").textContent=data.pingStatus;
    I("jitText").textContent=data.jitterStatus;
    var prog=(Number(data.dlProgress)*2+Number(data.ulProgress)*2+Number(data.pingProgress))/5;
	I("progress").style.width=(100*prog)+"%";
    // 保存数据到 speedtest 实例上（this 指向 s）
    this.lastTestData = data; 
    this.lastTestData.ipIspArr = I("ip").textContent.split(' - ', 3);
}
s.onend=function(aborted){ //callback for test ended/aborted
    I("startStopBtn").className=""; //按钮变回"Start"，但保留数据
    if(aborted){ 
        // 只有手动中止测试时，才清空UI
        initUI();
        return;
    }

    var testData = this.lastTestData;
    if(!testData){ 
        console.log("无测速数据");
        return;
    }

    // 兜底：即使IP解析失败，也用默认值
    var ipIspArr = testData.ipIspArr || [testData.clientIp || '', '', ''];
	var ip = ipIspArr[0] || testData.clientIp || '';
	var isp = ipIspArr[1] || '未知ISP';
	var addr = ipIspArr[2] || '未知地址';
	var key = Date.parse(new Date()) + "_" + ip; 
	var params = 'key='+key+'&ip='+ip+'&isp='+isp+'&addr='+addr+'&dspeed='+testData.dlStatus+'&uspeed='+testData.ulStatus+'&ping='+testData.pingStatus+'&jitter='+testData.jitterStatus;
	
	console.log("提交的数据：", params); 
	
	var xhr = new XMLHttpRequest();
	xhr.timeout = 3000;
	xhr.ontimeout = function (e) {
		console.log('上报超时');
	};
	xhr.onerror = function(e) {
		console.log('上报失败：', e); 
	};
	xhr.onload = function() {
		console.log('数据提交成功，响应：', xhr.responseText);
	};
	xhr.open('POST', url_report, true);
	xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
	xhr.send(params);

}

function startStop(){ //start/stop button pressed
	if(s.getState()==3){
		//speedtest is running, abort
		s.abort();
	}else{
		//test is not running, begin
		s.start();
		I("startStopBtn").className="running";
	}
}

//function to (re)initialize UI
function initUI(){
	I("dlText").textContent="";
	I("ulText").textContent="";
	I("pingText").textContent="";
	I("jitText").textContent="";
	I("ip").textContent="";
}

function I(id){return document.getElementById(id);}
</script>

<style type="text/css">
	html,body{
		border:none; padding:0; margin:0;
		background:#FFFFFF;
		color:#202020;
	}
	body{
		text-align:center;
		font-family:"Roboto",sans-serif;
	}
	h1{
		color:#404040;
	}
	#startStopBtn{
		display:inline-block;
		margin:0 auto;
		color:#6060AA;
		background-color:rgba(0,0,0,0);
		border:0.15em solid #6060FF;
		border-radius:0.3em;
		transition:all 0.3s;
		box-sizing:border-box;
		width:8em; height:3em;
		line-height:2.7em;
		cursor:pointer;
		box-shadow: 0 0 0 rgba(0,0,0,0.1), inset 0 0 0 rgba(0,0,0,0.1);
	}
	#startStopBtn:hover{
		box-shadow: 0 0 2em rgba(0,0,0,0.1), inset 0 0 1em rgba(0,0,0,0.1);
	}
	#startStopBtn.running{
		background-color:#FF3030;
		border-color:#FF6060;
		color:#FFFFFF;
	}
	#startStopBtn:before{
		content:"Start";
	}
	#startStopBtn.running:before{
		content:"Abort";
	}
	#test{
		margin-top:2em;
		margin-bottom:12em;
	}
	div.testArea{
		display:inline-block;
		width:14em;
		height:9em;
		position:relative;
		box-sizing:border-box;
	}
	div.testName{
		position:absolute;
		top:0.1em; left:0;
		width:100%;
		font-size:1.4em;
		z-index:9;
	}
	div.meterText{
		position:absolute;
		bottom:1.5em; left:0;
		width:100%;
		font-size:2.5em;
		z-index:9;
	}
	#dlText{
		color:#6060AA;
	}
	#ulText{
		color:#309030;
	}
	#pingText,#jitText{
		color:#AA6060;
	}
	div.meterText:empty:before{
		color:#505050 !important;
		content:"0.00";
	}
	div.unit{
		position:absolute;
		bottom:2em; left:0;
		width:100%;
		z-index:9;
	}
	div.testGroup{
		display:inline-block;
	}
	@media all and (max-width:65em){
		body{
			font-size:1.5vw;
		}
	}
	@media all and (max-width:40em){
		body{
			font-size:0.8em;
		}
		div.testGroup{
			display:block;
			margin: 0 auto;
		}
	}
	#progressBar{
		width:90%;
		height:0.3em;
		background-color:#EEEEEE;
		position:relative;
		display:block;
		margin:0 auto;
		margin-bottom:2em;
	}
	#progress{
		position:absolute;
		top:0; left:0;
		height:100%;
		width:0%;
		transition: width 2s;
		background-color:#90BBFF;
	}

</style>
</head>
<body>
<h1>Speedtest-X</h1>
<div id="startStopBtn" onclick="startStop()"></div>
<div id="test">
    <div id="progressBar"><div id="progress"></div></div>
	<div class="testGroup">
		<div class="testArea">
			<div class="testName">下载速度</div>
			<div id="dlText" class="meterText"></div>
			<div class="unit">Mbps</div>
		</div>
		<div class="testArea">
			<div class="testName">上传速度</div>
			<div id="ulText" class="meterText"></div>
			<div class="unit">Mbps</div>
		</div>
	</div>
	<div class="testGroup">
		<div class="testArea">
			<div class="testName">延迟</div>
			<div id="pingText" class="meterText"></div>
			<div class="unit">ms</div>
		</div>
		<div class="testArea">
			<div class="testName">抖动</div>
			<div id="jitText" class="meterText"></div>
			<div class="unit">ms</div>
		</div>
	</div>
	<div id="ipArea">
		IP地址: <span id="ip"></span>
	</div>
</div>
<p><a href="./results.html" target="_blank">查看测速记录</a></p>
<p><a href="https://github.com/BadApple9/speedtest-x" target="_blank">speedtest-x 项目地址</a></p>
<script type="text/javascript">
    initUI();
</script>
</body>
</html>

修改speedtest_worker.js，

根据需求修改上行和下载测试时长，关键参数修改如下：

java 复制代码

var settings = {
    mpot: false,
    test_order: "IP_D_U",//同时测试上行和下载
    time_ul_max: 60, // 上传60秒
    time_dl_max: 60, // 下载60秒
    time_auto: false, // 强制跑满60秒（可选，开启则可能缩短）
    time_ulGraceTime: 3,
    time_dlGraceTime: 1.5,
    count_ping: 30, // 延迟测试30次（可选）
    // ... 其他配置保持不变 ...
};