检测点 |
IP:端口 |
IP地理位置 |
最新丢包 |
最新响应(ms) |
共发包 |
收包(次) |
最快响应(ms) |
最慢响应(ms) |
平均响应(ms) |
丢包率 |
赞助商 |
电信 北京市|一区
|
123.150.76.218:80 |
正常 |
8.52ms |
5 |
5 |
6.62 |
38.68 |
14.22 |
0.00% |
数掘科技
|
电信 海南测试节点
|
123.150.76.218:80 |
正常 |
7.49ms |
5 |
5 |
7.49 |
327.55 |
143.95 |
0.00% |
测试节点
|
let messageCount = 0; // 初始化消息计数器
let requestLimit = 5; // 默认请求次数
// 获取选择的请求次数
// 获取 URL 参数中的域名和请求次数
// 如果 URL 中有 'url' 参数,则返回域名
// 判断是否允许发送消息
// 连接 WebSocket
requestLimit = limit; // 更新 requestLimit
// 如果请求次数超过50,则不连接 WebSocket
// socket = new WebSocket("wss://wss.tcping.ping.aa1.cn:8767");
// 连接成功
tableBody.innerHTML = ""; // 清空表格
messageCount = 0; // 重置消息计数器
// 开始请求数据
// 接收 WebSocket 数据
// 接收到城市列表
console.log(`获取到的 jc_Count_i:${jc_Count_i}`); // 打印输出确保正确
// 接收到每个城市的 Ping 测试结果
// 更新监测点计数
// 动态更新进度条
const progress = Math.min((messageCount / jcCount) * 100, 100); // 计算百分比
// 错误信息
// WebSocket 连接关闭
setTimeout(connectWebSocket, 5000); // 尝试重新连接
// 发送请求函数,支持循环发送
sendRequests(domain, count + 1); // 递归发送请求
// 显示城市和运营商列表
// 清空表格
// 根据城市列表动态生成表格
-->
// 页面加载时初始化 WebSocket 连接
// 存储 IP 地址和其出现次数
// 更新所有城市的 Ping 测试结果
// 初始化延迟数据对象
"dx": [], // 电信
"cu": [], // 联通
"cm": [], // 移动
"dx_multi": [], // 多线
"hw": [] // 海外
// 存储每个城市的延迟统计数据
// let cityStats = {};
// 更新每个城市的延迟信息、丢包率等
console.log("Received results:", results); // 打印数据查看结构
const province = result.province.trim(); // 省份名称
const city = result.city.trim(); // 城市名称
const operator = result.operator.trim(); // 运营商
const packet_test = parseInt(result.packet_test); // 丢包标记(1为丢包,0为未丢包)
const ip_address = result.ip_address; // IP 地址
const geo_location = result.geo_location; // IP 地理位置
const tcping_delay = parseFloat(result.tcping_delay); // TCPing 延迟
// 初始化该城市的延迟统计数据
count: 0, // 发包次数
lost: 0, // 丢包次数
min: Infinity, // 最小延迟
max: -Infinity, // 最大延迟
total: 0 // 总延迟
// 更新丢包次数和发包次数
cityStats[city].lost++; // 丢包次数增加
cityStats[city].count++; // 增加发包次数
// 更新延迟统计
cityStats[city].min = Math.min(cityStats[city].min, tcping_delay); // 更新最小延迟
cityStats[city].max = Math.max(cityStats[city].max, tcping_delay); // 更新最大延迟
cityStats[city].total += tcping_delay; // 累加总延迟
// 更新表格中的城市信息
// 绘制实时 TCPing 动画
// 计算并显示该城市的平均延迟
// 计算丢包率
// 更新表格中的发包次数、最快、最慢、平均延迟,丢包率
// 更新地图渲染
// china_map.setOption({
// series: [{
// data: mydata // 使用更新后的 mydata
// }]
// });
// 计算并显示每个运营商的最慢、最快和平均延迟
// function drawTCPingAnimation(city, tcping_delay) {
// const canvas = document.querySelector(`#canvas_${city}`);
// if (!canvas) return;
// const ctx = canvas.getContext('2d');
// const canvasWidth = canvas.width;
// const canvasHeight = canvas.height;
// // 将延迟值映射为颜色
// let color;
// // if (tcping_delay === 0 || tcping_delay > 300) {
// // color = 'red'; // 丢包或高延迟
// // } else if (tcping_delay <= 150) {
// // color = 'green'; // 低延迟
// // } else {
// // color = 'yellow'; // 中等延迟
// // }
// if (tcping_delay === 0) {
// color = 'red';
// }
// else if (tcping_delay <= 50.9 || tcping_delay > 0) {
// color = '#23a91c';
// // barHeight = Math.ceil((tcping_delay / 500) * canvasHeight);
// } else if (tcping_delay <= 100.9) {
// color = '#41dd40';
// } else if (tcping_delay <= 200.9) {
// color = '#bdf764';
// } else if (tcping_delay <= 500.9) {
// color = '#f69933';
// } else {
// color = 'red';
// }
// // 维护绘制进度
// if (!canvas.drawPosition) canvas.drawPosition = 0; // 初始化位置
// // 清理当前位置并绘制
// ctx.clearRect(canvas.drawPosition, 0, 2, canvasHeight); // 清除旧条形
// ctx.fillStyle = color;
// ctx.fillRect(canvas.drawPosition, 0, 2, canvasHeight);
// // 绘制条形
// // ctx.fillRect(x, canvasHeight - barHeight, 1, barHeight);
// // 移动绘制位置
// canvas.drawPosition += 2;
// if (canvas.drawPosition >= canvasWidth) {
// canvas.drawPosition = 0; // 循环绘制
// }
// }
// 设置颜色和高度映射规则
color = 'red'; // 丢包或未检测到延迟
barHeight = canvasHeight; // 红色且最高
color = '#228B22'; // 深绿
barHeight = Math.max(5, Math.ceil((tcping_delay / 50) * canvasHeight * 0.21)); // 高度较矮
color = '#006400'; // 深浅绿
barHeight = Math.ceil(((tcping_delay - 50) / 50) * canvasHeight * 0.2); // 高度略增加
color = '#006400'; // 深浅绿
barHeight = Math.ceil(((tcping_delay - 50) / 50) * canvasHeight * 0.3); // 高度略增加
color = '#90EE90'; // 浅绿
barHeight = Math.ceil(((tcping_delay - 100) / 100) * canvasHeight * 0.4); // 高度进一步增加
color = '#FFD700'; // 黄
barHeight = Math.ceil(((tcping_delay - 200) / 50) * canvasHeight * 0.5); // 高度接近顶部
color = '#FFD700'; // 黄
barHeight = Math.ceil(((tcping_delay - 200) / 50) * canvasHeight * 0.6); // 高度接近顶部
color = 'red'; // 高延迟
barHeight = canvasHeight; // 红色且最高
// 初始化绘制位置
// 清理当前位置并绘制新的条形
ctx.clearRect(canvas.drawPosition, 0, 2, canvasHeight); // 清除旧条形
ctx.fillRect(canvas.drawPosition, canvasHeight - barHeight, 2, barHeight); // 动态高度
// 更新绘制位置
canvas.drawPosition = 0; // 循环绘制
// 记录 IP 出现的次数
// 更新城市信息(响应时间、IP 和其他相关字段)
// 确保元素存在再更新
// 检查丢包次数并更新
// 更新延迟信息
// 设置颜色
// console.log(`Element with id 'last_tcping_delay_${city}' not found.`);
// 记录有效的 IP 地址
ipCounts2[ip_address] = 1; // 确保不重复记录同一个 IP
// 更新 IP 列表和 IP 数量显示
// 计算并显示每个运营商的最慢、最快和平均延迟
// 过滤掉无效的 time=0 值
const validEntries = latencyData[key].filter(entry => entry.time > 0); // 只保留有效数据
// 找到最快和最慢的条目
// 提取相关数据
// 计算平均值
// 更新表格的值
// 如果没有有效数据,显示 "N/A"
// 为“响应超时”单选框添加事件监听
// 当选择“响应超时”时,显示 TTL 为 0 的行
row.style.display = 'table-row'; // 显示 TTL 为 0 的行
// row.style.display = 'none'; // 隐藏其他行
// 更新 IP 列表
// 获取所有有效 IP 地址
// 将 IP 地址用换行符拼接
// 在输入框输入后触发ping测试(可选)
// document.getElementById("ip").addEventListener("keyup", function(event) {
// if (event.key === "Enter") {
// check_form();
// }
// });
let cityList = ''; // 城市列表字符串初始化
let minTime = Infinity; // 初始化最快时间
let maxTime = -Infinity; // 初始化最慢时间
let fastestCity = ''; // 初始化最快城市
let slowestCity = ''; // 初始化最慢城市
let showAverage = true; // 是否显示平均响应时间
const cities = params.data.cityes.filter(city => city.time > 0); // 排除响应时间为 0 的城市
// 更新最快和最慢时间
// 运营商标签
// 拼接城市信息
.join('
'); // 用换行符分隔
// 如果只有一个有效城市,不显示平均、最快、最慢时间
// 返回渲染的内容