• 请不要在回答技术问题时复制粘贴 AI 生成的内容

PingGlass - 现代化风格 ICMP / TCP 监控面板

相信各位有网络 ICMP 监控需求的话，或多或少都听过 SmokePing 这个项目。

SmokePing 是一个非常经典的开源网络性能监控工具，主要用于测量、记录以及可视化网络的 延迟、丢包率和连通性。从 2001 年发展至今，也算是经历了二十多年的风风雨雨。

我自己也用了 SmokePing 很长一段时间，不过随着监控的 Targets 越来越多，逐渐发现一些使用上的痛点。

其中一个最直接的问题就是它的 UI 。

SmokePing 的 Web UI 还是比较偏向传统桌面网页，在手机上查看的时候体验并不是特别友好 —— 而我本人又特别喜欢直接拿手机看网络状况。

另外，SmokePing 的图表主要是在后端生成，而不是像现在比较常见的 Web Application 一样，由后端提供数据，再交给前端进行交互和渲染。

当 Targets 数量越来越多以后，无论是管理 Targets ，还是日常查看大量监控图表，整体体验都会开始变得比较笨重。

于是就有了一个想法：

如果重新做一个现代版的 SmokePing ，会是什么样子？

然后坑就这样挖下去了 ~~这不是好事~~

于是有了：

PingGlass

PingGlass 是一个现代化 ICMP / TCP 网络延迟、丢包以及可用性监控面板。

项目目前主要使用：

Laravel 11
Vue 3
Inertia.js
Tailwind CSS
Apache ECharts
MySQL
Redis

监控部分：

ICMP 使用 fping
TCP 则直接通过 PHP Non-blocking Socket / stream_select 建立连接并计算连接延迟

整个系统就是一个 Laravel ，不需要额外再跑一个独立的 Probe 。

目前的一些功能 / 亮点

支持 ICMP / TCP Monitoring

每个 Target 都可以独立选择：
- ICMP
- TCP
- ICMP + TCP
TCP Target 可以自行指定端口。
使用 fping 进行 ICMP Probe

PingGlass 会使用 fping 批量 Probe Targets ，并保存每一次 Sample 的结果，包括：
- Median
- Average
- Min / Max
- P10 / P25 / P75 / P90 / P95
- Standard Deviation
- Packet Loss
并发 TCP Probe

TCP 监控使用 PHP Non-blocking Socket + stream_select。

同一个 Probe Chunk 内的 Targets 会并发建立 TCP Connection ，而不是一个一个慢慢等 Timeout 。
现代化 Target / Category 管理

不需要再手动修改配置文件然后重载。

可以直接从管理员后台：
- 新增 / 修改 / 删除 Targets
- 新增 Category
- 修改 ICMP / TCP
- 修改 TCP Port
- 修改 Probe Interval
- 调整 Threshold
- 调整公开 / 隐藏状态
支持不同 Probe 间隔时间

可以设置全局 Probe 间隔时间，也可以针对单独 Target 覆写。

目前支持：

1 / 2 / 5 / 10 / 15 / 30 / 60 分钟
响应式 UI

这个算是我当初开发 PingGlass 最主要的原因之一。

Desktop / Tablet / Mobile 都做了 Responsive 。

~~所以终于可以很舒服地躺在床上看 Packet Loss 了（？~~
Latency / Packet Loss 历史数据

可以查看：
- 1 Hour
- 6 Hours
- 24 Hours
- 7 Days
- 30 Days
- 6 Months
- 1 Year
后端同时会自动将 Raw Measurements Aggregate 成 5 Minutes 和 Hourly Rollup 。
Online / Degraded / Down / Unknown 状态判断

PingGlass 不只是单纯判断 Ping 得通还是 Ping 不通。

会根据：
- 丢包
- 延迟中位数
- ICMP 状态
- TCP 状态
- 连续失败次数
- 连续恢复次数
判断 Target 当前是：
- 🟢 Online 在线
- 🟡 Degraded 降级
- 🔴 Down 下线
- ⚪ Unknown 未知
故障跟踪

Target 出现故障后会自动建立一个 Incident ，直到 Target 恢复为止。

恢复以后也会自动记录：
- 开始时间
- 恢复时间
- 故障原因
- 持续时间
公共状态页面

可以直接把 PingGlass 当成一个简单的公共网络状态页面。

支持：
- Global Status
- Category Status
- Target Status
- 24 小时平均延迟
- Incident History
可以隐藏 Target IP / Hostname

有些 Probe 是想公开展示网络质量，但又不希望把实际 IP Address 公布出来。

所以每个 Target 都可以单独决定：

是否允许 Public Page 显示 Host / IP 。
CSV 批量导入 Targets

Targets 比较多的话，可以直接通过 CSV 批量导入。
系统健康状态

Admin Panel 里面也做了一个系统健康页面，可以查看：
- Database
- Redis
- Queue
- Workers
- Scheduler
- Failed Jobs
- fping
- TCP Connectivity
- Probe Cycle
等运行状态。
Dark Mode 深色模式

~~这应该属于现代 Web Application 的基本人权了。~~

一些截图

公共状态页面

可以快速查看整体网络状态、各个 Category 、Targets 以及过去 24 小时的延迟趋势。

PingGlass Public Dashboard

监控页面

每个 Target 都有独立的详细监控页面，可以查看 ICMP / TCP 延迟、Packet Loss 、Percentile 以及历史数据。

PingGlass Target Monitoring

Responsive UI

这也是我开发 PingGlass 最主要的动力之一。

PingGlass Responsive Interface

故障跟踪

PingGlass Incident Tracking

管理员后台

PingGlass Admin Dashboard

Target 管理

PingGlass Target Management

监控设置

PingGlass Monitoring Settings

系统健康状态

PingGlass System Health

关于部署

项目目前有完整的部署文档，包括：

Ubuntu
Nginx
Supervisor
Docker
MySQL
Redis
Queue Worker
Laravel Scheduler
Existing Database Upgrade
Large Installation Tuning

如果使用 1Panel 部署的话，请务必按照项目部署文档中的 1Panel 部署方式进行配置。

因为 Laravel 的 Queue Worker 、Scheduler 、Nginx Root Directory 等地方需要特别注意，不建议直接按照普通 PHP 网站的方式一键部署。

接下来准备做什么？

PingGlass 目前还属于一个比较早期的版本，肯定还有非常多可以改善的地方。

根据目前收到的一些 Feedback ，下一版比较优先准备修改的是：

1. Latency + Packet Loss 合并到同一个 Chart

目前 Latency 和 Packet Loss 还是分开的。

之后准备改成更接近 SmokePing 的方式，把 Packet Loss 情况直接整合进 Latency Chart ，并通过不同颜色表示不同程度的丢包。

这样查看网络质量的时候会直观很多。

2. Master / Slave Architecture

这个也已经在 Roadmap 里面。

未来希望可以让一台 Master PingGlass 管理多个不同地区的 Probe Node 。

例如：

                Master
                  |
        ---------------------
        |         |         |
     Malaysia   Japan      US
      Probe     Probe     Probe

这样就可以从多个地区同时对同一个 Target 进行网络质量监控。

不过这个应该会在后几个版本才开始做。

~~先给未来的自己挖个坑。~~