Uptime Kuma 中的状态页面允许您创建面向公众的仪表板,显示监控服务的状态。这些页面为用户提供了关于您的系统可用性的透明度,并有助于有效传达事件和维护时段。
状态页面充当您的监控系统与用户之间的沟通桥梁。每个状态页面都可以显示多个监控组,显示当前和历史正常运行时间,显示事件,并提供实时状态更新。
来源: server/model/status_page.js13-489 server/routers/status-page-router.js1-248 server/socket-handlers/status-page-socket-handler.js16-356
状态页面采用分层架构构建,并与 Uptime Kuma 的多个组件集成
来源: server/model/status_page.js13-489 server/routers/status-page-router.js1-248 server/socket-handlers/status-page-socket-handler.js16-356 src/pages/StatusPage.vue1-2127
了解数据如何在状态页面系统中流动有助于阐明其工作原理
来源: server/routers/status-page-router.js16-112 server/socket-handlers/status-page-socket-handler.js93-258 src/pages/StatusPage.vue698-756
状态页面使用多个数据库表,它们具有以下关系
来源: server/model/status_page.js395-435 server/socket-handlers/status-page-socket-handler.js154-233
状态页面高度可配置,具有以下选项
| 选项 | 描述 | 默认值 |
|---|---|---|
| slug | URL 友好标识符(/status/slug) | 必填 |
| title | 状态页面的显示标题 | 必填 |
| description | 页面上显示的 Markdown 描述 | "" |
| icon | 状态页面的自定义徽标 | "/icon.svg" |
| theme | 主题(自动/浅色/深色) | “auto” |
| autoRefreshInterval | 自动刷新间隔(秒) | 300 |
| showTags | 是否显示监控标签 | false |
| domainNameList | 状态页面的自定义域名 | [] |
| customCSS | 用于样式化页面的自定义 CSS | "" |
| footerText | 自定义页脚文本(markdown) | "" |
| showPoweredBy | 是否显示“由 Uptime Kuma 提供支持” | true |
| googleAnalyticsId | 用于跟踪的 Google Analytics ID | "" |
| showCertificateExpiry | 是否显示证书过期 | false |
来源: src/pages/StatusPage.vue4-105 server/model/status_page.js395-435 server/socket-handlers/status-page-socket-handler.js154-169
状态页面由出现在渲染页面上的几个关键组件组成
来源: src/pages/StatusPage.vue129-350
状态页面显示以下总体状态
| 状态 | 常量 | 描述 |
|---|---|---|
| 所有系统运行正常 | STATUS_PAGE_ALL_UP | 所有监控器均正常运行 |
| 部分服务降级 | STATUS_PAGE_PARTIAL_DOWN | 部分监控器出现故障 |
| 服务降级 | STATUS_PAGE_ALL_DOWN | 所有监控器均出现故障 |
| 维护中 | STATUS_PAGE_MAINTENANCE | 至少有一个监控器处于维护模式 |
来源: server/model/status_page.js159-211 src/pages/StatusPage.vue245-263
事件是向状态页面查看者传达问题或更新的一种方式
来源: src/pages/StatusPage.vue180-233 server/socket-handlers/status-page-socket-handler.js19-91
状态页面具有多个用于公共访问的 REST API 端点
| 端点 | 方法 | 描述 | 缓存持续时间 |
|---|---|---|---|
/status/:slug | GET | 渲染状态页面的 HTML | 5 分钟 |
/status/:slug/rss | GET | 提供状态页面的 RSS 源 | 5 分钟 |
/api/status-page/:slug | GET | 返回状态页面的配置和数据 | 5 分钟 |
/api/status-page/heartbeat/:slug | GET | 返回监控器的心跳数据 | 1 分钟 |
/api/status-page/:slug/manifest.json | GET | 返回状态页面的 PWA manifest | 1440 分钟 |
/api/status-page/:slug/badge | GET | 返回显示总体状态的 SVG 徽章 | 5 分钟 |
来源: server/routers/status-page-router.js16-245 server/routers/api-router.js150-211
以下 Socket.IO 事件用于管理状态页面
| 事件 | 描述 | 参数 |
|---|---|---|
addStatusPage | 创建新的状态页面 | title, slug |
getStatusPage | 获取状态页面配置 | slug |
saveStatusPage | 保存状态页面配置 | slug, config, imgDataUrl, publicGroupList |
deleteStatusPage | 删除状态页面 | slug |
postIncident | 发布或编辑事件 | slug, incident |
unpinIncident | 取消固定事件 | slug |
来源: server/socket-handlers/status-page-socket-handler.js19-356
来源: src/pages/AddStatusPage.vue1-90 src/pages/ManageStatusPage.vue1-124
来源: src/pages/StatusPage.vue4-126 server/socket-handlers/status-page-socket-handler.js119-258
来源: src/pages/StatusPage.vue180-233 server/socket-handlers/status-page-socket-handler.js19-70
可以通过自定义域名访问状态页面,方法是配置 domainNameList
来源: server/model/status_page.js336-373 server/model/status_page.js304-310
状态页面可以包含 Google Analytics 跟踪,方法是配置 Google Analytics ID
来源: server/model/status_page.js123-126 server/google-analytics.js10-24
您可以将状态徽章嵌入到外部网站,以显示您服务的当前状态
https://your-uptime-kuma.example.com/api/status-page/your-slug/badge
可以使用查询参数自定义徽章样式。
来源: server/routers/status-page-router.js151-245
每个状态页面都会自动提供一个 RSS feed,客户端可以订阅该 feed 以获取更新
https://your-uptime-kuma.example.com/status/your-slug/rss
来源: server/model/status_page.js70-94 server/routers/status-page-router.js22-26
通过有效利用状态页面,您可以向用户提供有关服务状态的透明度,并通过事件期间的清晰沟通来建立信任。