Nunchaku-flux-1-dev模型服务监控：使用Node.js搭建性能仪表盘

Nunchaku-flux-1-dev模型服务监控使用Node.js搭建性能仪表盘你是不是也遇到过这种情况自己部署的AI模型服务用着用着突然就变慢了或者干脆没响应了用户反馈过来才知道出了问题。等到发现的时候可能已经影响了不少人。对于像Nunchaku-flux-1-dev这样的模型服务保证它稳定、可靠地运行是提供良好体验的基础。你不能总等着用户来告诉你“服务挂了”得主动去了解它的“健康状况”。今天我就带你用Node.js从零开始搭建一个轻量级的性能监控仪表盘。它不复杂但很实用能帮你定时“体检”服务记录关键指标还能在出问题时及时提醒你。整个过程就像给服务装上一个“健康手环”让你随时掌握它的心跳。1. 项目目标与环境准备我们要做的这个监控系统核心功能很明确定期去“敲敲”Nunchaku-flux-1-dev服务的门看看它反应快不快、能不能正常应答然后把每次检查的结果记下来用图表展示出来。一旦发现它“生病”了比如反应太慢或直接不应答就立刻给我们发个消息。1.1 你需要准备什么在开始敲代码之前确保你的电脑上已经准备好了这几样东西Node.js运行环境这是我们整个项目的基础。建议安装最新的LTS长期支持版本用起来更稳定。一个代码编辑器比如VS Code、WebStorm或者你习惯的任何一款。一个可访问的Nunchaku-flux-1-dev API服务地址你需要知道它的端点EndpointURL以及调用它可能需要用到的API密钥如果有的话。一个能发送通知的途径我们计划在服务异常时发送告警你可以准备一个邮箱用于邮件告警或者一个支持Webhook的即时通讯工具如钉钉、企业微信、Slack的Webhook地址。1.2 初始化你的项目打开终端命令行找一个你喜欢的目录执行以下步骤# 1. 创建一个新的项目文件夹并进入它 mkdir nunchaku-monitor-dashboard cd nunchaku-monitor-dashboard # 2. 初始化一个新的Node.js项目一路按回车使用默认值即可 npm init -y执行完npm init -y后你会看到目录下生成了一个package.json文件它就像是这个项目的“身份证”和“说明书”。接下来我们需要安装这个项目依赖的几个核心“零件”# 安装项目依赖包 npm install axios express node-cron nodemailer chart.js chartjs-node-canvas我来简单介绍一下这几个包是干什么的axios一个非常好用的HTTP客户端我们用它来向Nunchaku-flux-1-dev服务发送测试请求。express一个轻量灵活的Web应用框架用来搭建我们展示监控数据的网页服务器。node-cron一个任务调度库可以让我们像设置闹钟一样定时比如每分钟执行一次健康检查。nodemailer一个发送邮件的工具当服务异常时我们可以通过它发邮件提醒自己。chart.jschartjs-node-canvas这两个是黄金搭档用来在服务器端生成美观的图表将监控数据可视化。好了工具和材料都备齐了接下来我们开始动手组装。2. 构建核心监控逻辑监控的核心就是“问”与“记”。我们要写一个脚本让它定期去询问服务状态并把每次的问答结果忠实地记录下来。2.1 创建监控脚本在你的项目根目录下创建一个名为monitor.js的文件。我们将把主要的监控逻辑写在这里。// monitor.js const axios require(axios); const cron require(node-cron); const fs require(fs).promises; const path require(path); // 1. 配置你的Nunchaku-flux-1-dev服务信息 const config { serviceUrl: YOUR_NUNCHAKU_FLUX_API_ENDPOINT, // 替换为你的服务地址 apiKey: YOUR_API_KEY_HERE, // 如果有API密钥请替换 checkInterval: * * * * *, // Cron表达式每分钟执行一次 dataFile: path.join(__dirname, monitor-data.json) // 数据存储文件 }; // 2. 健康检查函数 async function performHealthCheck() { const startTime Date.now(); let status down; let responseTime null; let errorMessage null; try { // 构建请求配置根据你的服务实际情况调整 const requestConfig { method: post, // 通常是POST请根据你的API文档确认 url: config.serviceUrl, headers: { Content-Type: application/json, }, data: { // 这里是发送给模型的提示词可以是一个简单的测试问题 prompt: Hello, are you working?, max_tokens: 10 }, timeout: 10000 // 设置10秒超时避免长时间等待 }; // 如果有API密钥添加到请求头中 if (config.apiKey config.apiKey ! YOUR_API_KEY_HERE) { requestConfig.headers[Authorization] Bearer ${config.apiKey}; } const response await axios(requestConfig); const endTime Date.now(); responseTime endTime - startTime; // 判断服务是否正常有响应且状态码为2xx if (response.status 200 response.status 300) { status up; console.log([${new Date().toISOString()}] 检查成功响应时间${responseTime}ms); } else { status down; errorMessage HTTP状态码异常: ${response.status}; console.log([${new Date().toISOString()}] 检查失败状态码${response.status}); } } catch (error) { const endTime Date.now(); responseTime endTime - startTime; status down; errorMessage error.message; console.log([${new Date().toISOString()}] 检查异常错误${error.message}); } // 3. 构建本次检查的记录 const checkRecord { timestamp: new Date().toISOString(), status: status, responseTime: responseTime, error: errorMessage }; // 4. 将记录保存到文件 await saveCheckRecord(checkRecord); // 5. 触发告警逻辑如果状态是down if (status down) { await triggerAlert(checkRecord); } return checkRecord; } // 保存单次检查记录到JSON文件 async function saveCheckRecord(record) { try { let allData []; // 尝试读取已有的数据文件 try { const data await fs.readFile(config.dataFile, utf8); allData JSON.parse(data); } catch (readError) { // 如果文件不存在或读取失败就从空数组开始 allData []; } // 将新记录添加到数组开头 allData.unshift(record); // 为了不让文件无限增大我们只保留最近1000条记录 if (allData.length 1000) { allData allData.slice(0, 1000); } // 将更新后的数据写回文件 await fs.writeFile(config.dataFile, JSON.stringify(allData, null, 2), utf8); } catch (error) { console.error(保存监控数据失败, error); } } // 触发告警这里先留空下一节我们会实现它 async function triggerAlert(record) { console.log([告警] 服务不可用时间${record.timestamp}, 错误${record.error}); // 具体的告警发送逻辑将在后面补充 } // 6. 设置定时任务 console.log(启动Nunchaku-flux-1-dev服务监控检查间隔每分钟一次); cron.schedule(config.checkInterval, performHealthCheck); // 立即执行一次健康检查 performHealthCheck();这个脚本做了以下几件关键的事配置在开头定义了你的服务地址、检查频率等。检查performHealthCheck函数负责发送请求并计算响应时间和判断状态。记录saveCheckRecord函数把每次检查的结果时间、状态、耗时保存到一个JSON文件里。调度使用node-cron让performHealthCheck函数按照你设定的时间规则这里是每分钟自动运行。现在你需要做两件重要的事将代码中的YOUR_NUNCHAKU_FLUX_API_ENDPOINT替换成你真实的Nunchaku-flux-1-dev API地址。如果有API密钥将YOUR_API_KEY_HERE也替换掉。保存文件后你可以在终端运行一下试试node monitor.js如果配置正确你应该会看到类似[时间] 检查成功响应时间XXXms的日志输出并且目录下会生成一个monitor-data.json文件里面保存着检查记录。让这个脚本在后台运行起来它就会开始默默为你收集服务的健康数据了。3. 创建数据可视化仪表盘光有数据还不够我们需要一个直观的页面来查看这些数据。接下来我们用Express来搭建一个简单的Web服务器并绘制图表。3.1 创建Web服务器在项目根目录下再创建一个名为dashboard.js的文件。// dashboard.js const express require(express); const fs require(fs).promises; const path require(path); const { createCanvas } require(canvas); const { ChartJSNodeCanvas } require(chartjs-node-canvas); const app express(); const port 3000; // 你可以改成其他端口 const dataFile path.join(__dirname, monitor-data.json); // 设置视图引擎我们直接用简单的HTML字符串 app.set(view engine, html); // 提供静态文件如果需要的话 app.use(express.static(public)); // 1. 主页路由 - 展示监控仪表盘 app.get(/, async (req, res) { try { const data await fs.readFile(dataFile, utf8); const monitorData JSON.parse(data); // 计算一些总体统计数据 const totalChecks monitorData.length; const upChecks monitorData.filter(d d.status up).length; const uptimePercentage totalChecks 0 ? ((upChecks / totalChecks) * 100).toFixed(2) : 0; // 计算平均响应时间仅统计成功的请求 const successfulChecks monitorData.filter(d d.status up d.responseTime); const avgResponseTime successfulChecks.length 0 ? (successfulChecks.reduce((sum, d) sum d.responseTime, 0) / successfulChecks.length).toFixed(2) : N/A; // 获取最近24小时的记录用于图表 const twentyFourHoursAgo new Date(Date.now() - 24 * 60 * 60 * 1000); const recentData monitorData.filter(d new Date(d.timestamp) twentyFourHoursAgo).slice(0, 100); // 最多取100条 // 生成一个简单的HTML页面 const html !DOCTYPE html html langzh-CN head meta charsetUTF-8 meta nameviewport contentwidthdevice-width, initial-scale1.0 titleNunchaku-flux-1-dev 服务监控仪表盘/title style body { font-family: Arial, sans-serif; margin: 40px; background-color: #f5f5f5; } .container { max-width: 1200px; margin: 0 auto; } .header { text-align: center; margin-bottom: 30px; } .stats { display: flex; justify-content: space-around; margin-bottom: 30px; flex-wrap: wrap; } .stat-card { background: white; padding: 20px; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1); text-align: center; min-width: 200px; margin: 10px; } .stat-value { font-size: 2.5em; font-weight: bold; margin: 10px 0; } .up { color: #4CAF50; } .down { color: #F44336; } .neutral { color: #2196F3; } .chart-container { background: white; padding: 20px; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1); margin-bottom: 20px; } .recent-logs { background: white; padding: 20px; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1); } table { width: 100%; border-collapse: collapse; } th, td { padding: 12px 15px; text-align: left; border-bottom: 1px solid #ddd; } th { background-color: #f2f2f2; } .status-up { color: #4CAF50; } .status-down { color: #F44336; } /style /head body div classcontainer div classheader h1 Nunchaku-flux-1-dev 服务监控仪表盘/h1 p最后更新: ${new Date().toLocaleString()}/p /div div classstats div classstat-card h3服务状态/h3 div classstat-value ${monitorData[0]?.status up ? up : down} ${monitorData[0]?.status up ? 运行正常 : 服务异常} /div p基于最近一次检查/p /div div classstat-card h3可用率/h3 div classstat-value neutral${uptimePercentage}%/div p总检查: ${totalChecks} 次 | 成功: ${upChecks} 次/p /div div classstat-card h3平均响应时间/h3 div classstat-value neutral${avgResponseTime} ms/div p基于成功的请求/p /div /div div classchart-container h2响应时间趋势最近24小时/h2 img src/chart/response-time alt响应时间图表 stylewidth:100%; / /div div classchart-container h2服务状态分布最近24小时/h2 img src/chart/status-distribution alt状态分布图表 stylewidth:100%; / /div div classrecent-logs h2最近检查记录/h2 table thead tr th时间/th th状态/th th响应时间 (ms)/th th详情/th /tr /thead tbody ${recentData.map(record tr td${new Date(record.timestamp).toLocaleString()}/td td classstatus-${record.status}${record.status up ? ✅ 正常 : ❌ 异常}/td td${record.responseTime || N/A}/td td${record.error || 请求成功}/td /tr ).join()} /tbody /table /div /div script // 每60秒自动刷新页面以获取最新数据 setTimeout(() { location.reload(); }, 60000); /script /body /html ; res.send(html); } catch (error) { console.error(加载仪表盘数据失败, error); res.status(500).send(无法加载监控数据请检查监控服务是否正在运行。); } }); // 2. 图表生成路由 - 响应时间折线图 app.get(/chart/response-time, async (req, res) { try { const data await fs.readFile(dataFile, utf8); const monitorData JSON.parse(data); // 获取最近50条数据用于绘图 const chartData monitorData.slice(0, 50).reverse(); // 反转让时间从旧到新 const labels chartData.map(d new Date(d.timestamp).toLocaleTimeString()); const responseTimes chartData.map(d d.responseTime || 0); const configuration { type: line, data: { labels: labels, datasets: [{ label: 响应时间 (ms), data: responseTimes, borderColor: rgb(75, 192, 192), backgroundColor: rgba(75, 192, 192, 0.2), tension: 0.1, fill: true }] }, options: { responsive: true, plugins: { title: { display: true, text: 服务响应时间趋势 } }, scales: { y: { beginAtZero: true, title: { display: true, text: 响应时间 (ms) } } } } }; const chartJSNodeCanvas new ChartJSNodeCanvas({ width: 800, height: 400 }); const imageBuffer await chartJSNodeCanvas.renderToBuffer(configuration); res.set(Content-Type, image/png); res.send(imageBuffer); } catch (error) { console.error(生成响应时间图表失败, error); res.status(500).send(图表生成错误); } }); // 3. 图表生成路由 - 状态分布饼图 app.get(/chart/status-distribution, async (req, res) { try { const data await fs.readFile(dataFile, utf8); const monitorData JSON.parse(data); // 获取最近100条数据 const recentData monitorData.slice(0, 100); const upCount recentData.filter(d d.status up).length; const downCount recentData.length - upCount; const configuration { type: pie, data: { labels: [正常, 异常], datasets: [{ data: [upCount, downCount], backgroundColor: [ rgb(75, 192, 192), // 正常 - 绿色系 rgb(255, 99, 132) // 异常 - 红色系 ], borderWidth: 1 }] }, options: { responsive: true, plugins: { title: { display: true, text: 服务状态分布最近100次检查 }, legend: { position: bottom } } } }; const chartJSNodeCanvas new ChartJSNodeCanvas({ width: 600, height: 400 }); const imageBuffer await chartJSNodeCanvas.renderToBuffer(configuration); res.set(Content-Type, image/png); res.send(imageBuffer); } catch (error) { console.error(生成状态分布图表失败, error); res.status(500).send(图表生成错误); } }); // 启动服务器 app.listen(port, () { console.log(监控仪表盘已启动请访问 http://localhost:${port}); });这个服务器提供了三个主要页面主页 (/)一个完整的监控仪表盘展示关键统计数据、最近记录并嵌入了图表。响应时间图表 (/chart/response-time)动态生成一张显示最近响应时间变化的折线图。状态分布图表 (/chart/status-distribution)动态生成一张饼图展示最近检查中正常与异常的比例。现在打开一个新的终端窗口启动这个仪表盘服务器node dashboard.js然后在浏览器中访问http://localhost:3000你就能看到一个直观的监控面板了它会每分钟自动刷新一次展示最新的监控数据。4. 实现异常告警机制监控的最后一环是“通知”。当服务出现问题时我们需要第一时间知道。我们来完善之前留下的triggerAlert函数实现邮件告警。4.1 配置邮件告警首先你需要有一个可以用来发送告警邮件的邮箱。这里以QQ邮箱为例其他邮箱服务商类似需要开启SMTP服务并获取授权码。修改monitor.js文件我们先在配置部分添加邮箱信息// 在 monitor.js 的 config 对象中添加邮件配置 const config { serviceUrl: YOUR_NUNCHAKU_FLUX_API_ENDPOINT, apiKey: YOUR_API_KEY_HERE, checkInterval: * * * * *, dataFile: path.join(__dirname, monitor-data.json), // 新增邮件告警配置 alert: { enabled: true, // 是否启用告警 email: { service: QQ, // 使用QQ邮箱也可以是 Gmail, 163 等 auth: { user: your-emailqq.com, // 你的发件邮箱 pass: your-authorization-code // 不是邮箱密码是SMTP授权码 }, from: your-emailqq.com, // 发件人 to: alert-receiverexample.com, // 收件人可以是你自己的邮箱 subjectPrefix: [Nunchaku服务监控告警] // 邮件主题前缀 } } };重要提示auth.pass填的是你在邮箱设置中获取的SMTP授权码不是你的邮箱登录密码。4.2 完善告警触发函数接下来我们修改monitor.js中的triggerAlert函数让它真正能发送邮件。// 在 monitor.js 中完善 triggerAlert 函数 const nodemailer require(nodemailer); // 确保顶部已经引入了 async function triggerAlert(record) { // 如果未启用告警则直接返回 if (!config.alert || !config.alert.enabled) { console.log([告警]未启用服务不可用时间${record.timestamp}); return; } console.log([告警] 触发告警时间${record.timestamp}, 错误${record.error}); const alertConfig config.alert.email; // 创建邮件传输器 const transporter nodemailer.createTransport({ service: alertConfig.service, auth: alertConfig.auth }); // 邮件内容 const mailOptions { from: alertConfig.from, to: alertConfig.to, subject: ${alertConfig.subjectPrefix}服务异常 - ${record.timestamp}, html: h2 Nunchaku-flux-1-dev 服务监控告警/h2 pstrong检测时间/strong ${new Date(record.timestamp).toLocaleString()}/p pstrong服务状态/strong span stylecolor: red; font-weight: bold;异常/span/p pstrong响应时间/strong ${record.responseTime || N/A} ms/p pstrong错误信息/strong ${record.error || 未知错误}/p hr p请及时检查服务状态。/p p监控仪表盘a hrefhttp://YOUR_SERVER_IP:3000点击查看/a/p }; try { const info await transporter.sendMail(mailOptions); console.log([告警] 告警邮件已发送: ${info.messageId}); } catch (error) { console.error([告警] 发送邮件失败:, error); } }记得将邮件内容中的http://YOUR_SERVER_IP:3000替换成你实际部署仪表盘的地址。现在当你的monitor.js脚本检测到服务状态为down时它就会自动向你指定的邮箱发送一封告警邮件。这样无论你在哪里都能第一时间感知到服务异常。5. 部署与优化建议基本的监控系统已经搭建完成了。为了让它能7x24小时稳定运行并更贴合实际生产环境这里还有一些建议。5.1 如何让监控持续运行你不能总开着电脑终端来运行脚本。可以考虑以下方式使用PM2推荐这是一个非常流行的Node.js进程管理工具。# 全局安装PM2 npm install -g pm2 # 使用PM2启动监控脚本后台运行并设置日志 pm2 start monitor.js --name nunchaku-monitor pm2 start dashboard.js --name nunchaku-dashboard # 查看运行状态 pm2 status # 设置开机自启动 pm2 startup pm2 save这样即使服务器重启你的监控服务也会自动恢复。使用系统服务如systemd对于Linux服务器可以创建systemd服务单元文件来管理。5.2 监控脚本的优化方向我们当前实现的是一个最小可行产品MVP。你可以根据需求进一步强化它更丰富的检查除了简单的“你好”测试可以发送更复杂的推理请求测试模型的完整功能。历史数据清理实现按时间如只保留7天数据或按大小自动清理旧的监控数据文件。多维度告警除了“宕机”告警可以增加“慢响应”告警如响应时间连续多次超过某个阈值。告警升级机制首次告警发邮件如果问题持续未恢复后续可以发送短信或调用更紧急的通讯工具Webhook。数据持久化将数据从JSON文件迁移到数据库如SQLite、PostgreSQL便于复杂查询和分析。更丰富的仪表盘增加更多图表如可用率变化曲线、每日错误统计等。5.3 安全注意事项保护API密钥不要将包含真实API密钥的代码提交到公开的代码仓库。可以使用环境变量或配置文件并在.gitignore中忽略它们。访问控制当前的仪表盘是公开的如果服务器有公网IP。在生产环境你应该为仪表盘添加基本的身份验证如用户名密码避免监控数据被随意查看。整个搭建过程就是这样。从编写一个简单的定时检查脚本到构建一个可视化的数据看板再到添加上异常通知功能我们一步步完成了一个虽小但五脏俱全的模型服务监控系统。实际用下来这套方案能很好地满足对服务状态的基本把控需求。启动和运行都不复杂代码结构也清晰你可以很方便地根据自己的业务逻辑进行修改和扩展。最关键的是它给了你一种“掌控感”不再需要被动地等待问题发生。如果你刚开始接触服务监控建议先把这个基础版本跑起来感受一下数据收集和告警的整个流程。等你熟悉了再根据上面提到的优化建议逐步把它打磨成更符合你业务需求的工具。监控本身不是一个一劳永逸的事情它需要随着你的服务一起成长和调整。获取更多AI镜像想探索更多AI镜像和应用场景访问 CSDN星图镜像广场提供丰富的预置镜像覆盖大模型推理、图像生成、视频生成、模型微调等多个领域支持一键部署。