VPS Monitor 动态化改造：从硬编码到自动发现服务

自建的 VPS Monitor 监控面板一直有个痛点：Web 服务列表是硬编码的。每次删掉一个服务（比如 Dify、Tokyo Traffic），页面里还显示着，必须手动改代码。这根本不算「监控」——真正的监控应该自动发现服务。

这篇文章记录把服务列表从硬编码改成动态发现的完整过程。

问题

原来的代码（src/app/api/vps/route.ts）是这样：

const webServices = [
  { name: "VPS Monitor", port: 3003, path: "/", category: "monitoring" },
  { name: "one-api", port: 3000, path: "/", category: "llm" },
  { name: "Dify", port: 8088, path: "/", category: "llm" },        // ← 删了还显示
  { name: "Tokyo Traffic", port: 8001, path: "/", category: "traffic" },  // ← 删了还显示
  // ... 13 个硬编码
];

• 删服务后忘改代码 → 显示错误
• 加服务后忘加配置 → 不显示
• 改描述要重新 build → 麻烦