Homepage 集成 Zabbix 监控告警小组件配置、字段与 JSON-RPC 原理详解【免费下载链接】homepageA highly customizable homepage (or startpage / application dashboard) with Docker and service API integrations.项目地址: https://gitcode.com/GitHub_Trending/ho/homepage导读本文讲解如何在 Homepage高度可自定义的主页 / 启动页 / 应用仪表盘中接入 Zabbix 监控系统将 Zabbix 触发器按严重级别实时展示为告警计数小组件。阅读本文后你将掌握 Zabbix 小组件的完整配置方法URL、API Token、自定义显示字段、Zabbix 7.0 触发器在六种严重级别下的计数逻辑以及 Homepage 通过 JSON-RPC 代理调用 Zabbix API 的底层实现原理。相关文档位于 docs/widgets/services/zabbix.md配套源码位于 src/widgets/zabbix/。功能概述Zabbix 小组件是 Homepage 服务类小组件Services Widget之一用于在首页展示当前处于问题状态的触发器trigger数量并按严重级别分类统计。它把 Zabbix 的告警严重度体系未分类 / 信息 / 警告 / 平均 / 高 / 灾难直接映射为仪表盘上的数字块让运维人员无需打开 Zabbix 前端即可一眼掌握当前告警态势。从源码结构看该小组件与 Homepage 中其他服务小组件采用统一的三件套架构src/widgets/zabbix/widget.js定义 API 端点、代理处理器proxy handler与 API 映射mappings是小组件的数据契约src/widgets/zabbix/component.jsx负责数据获取与界面渲染配套的 src/widgets/zabbix/widget.test.js 与 src/widgets/zabbix/component.test.jsx通过 Vitest 验证配置结构合法性与渲染逻辑。快速配置在 Homepage 的services.yaml参见 src/skeleton/services.yaml 骨架示例中为某个服务分组添加如下配置widget: type: zabbix url: http://zabbix.host.or.ip/zabbix key: your-api-key配置字段说明字段必填说明type是固定为zabbix用于在 src/widgets/widgets.js 注册表中找到对应实现url是Zabbix 前端 Web 界面根地址须以/zabbix结尾或与你的 Zabbix 实际部署路径一致Homepage 会在其后拼接api_jsonrpc.phpkey是Zabbix API Token见下文获取 API Token获取 API Token原文档明确指出API Token 的生成方式请参阅 Zabbix 官方文档中Users → API tokens前端用户 API Token部分。在 Zabbix 前端中为相应用户创建 API Token 后将生成的 Token 填入key字段即可。文档同时声明该小组件至少支持 Zabbix server 7.0 版本。鉴权方式与源码印证从 src/utils/proxy/handlers/jsonrpc.js 的实现可以确认代理层支持两种鉴权模式if (widget?.username widget?.password) { headers.Authorization Basic ${Buffer.from(${widget.username}:${widget.password}).toString(base64)}; } if (widget?.key) { headers.Authorization Bearer ${widget.key}; }即配置key时以Bearer token方式鉴权推荐与 Zabbix 7.0 的 API Token 机制对应若同时配置username与password则退化为 HTTP Basic 鉴权。请求头还会显式设置content-type: application/json与accept: application/json符合 Zabbix JSON-RPC API 的要求。可显示字段与自定义小组件支持以下 6 个严重级别字段[unclassified, information, warning, average, high, disaster]它们与 Zabbix 触发器优先级priority的对应关系定义在 src/widgets/zabbix/component.jsx字段名Zabbix priority 值含义unclassified0未分类information1信息warning2警告average3平均high4高disaster5灾难关键限制同一时刻最多只能显示 4 个字段。默认显示widget: type: zabbix url: http://zabbix.host.or.ip/zabbix key: your-api-key fields: - warning - average - high - disaster若不配置fields默认即为[warning, average, high, disaster]跳过信息量较低的两档。该行为在 src/widgets/zabbix/component.jsx 中有明确实现if (!widget.fields) { widget.fields [warning, average, high, disaster]; } else if (widget.fields?.length 4) { widget.fields widget.fields.slice(0, 4); }注意如果用户配置超过 4 个字段组件会静默截断为前 4 个而非报错。渲染时每个字段对应一个Block其显示标签来自多语言文件 public/locales/en/common.json如warning→ Warning、disaster→ Disaster其他语言包public/locales/下的zh-Hans、ja、de等同样提供对应翻译。渲染逻辑与测试验证组件通过useWidgetAPI(widget, trigger)拉取数据src/components/services/widget/ 与 src/utils/proxy/use-widget-api.js 提供通用数据获取机制随后对返回的触发器列表按 priority 值分组计数const unclassified zabbixData.filter((item) item.priority PriorityUnclassified).length; const information zabbixData.filter((item) item.priority PriorityInformation).length; // ... 其余级别同理src/widgets/zabbix/component.test.jsx 中的测试用例直接验证了这套逻辑传入[{ priority: 2 }, { priority: 3 }, { priority: 3 }, { priority: 5 }]时期望输出 warning1、average2、high0、disaster1同时验证未配置fields时默认值被填充、未选中的字段unclassified / information不会渲染以及接口报错时展示错误 UIwidget.api_error。数据获取原理JSON-RPC 代理调用链Zabbix 的 API 基于 JSON-RPC 2.0 协议Homepage 通过内置的 JSON-RPC 代理处理器与其通信整个调用链清晰可循1. 端点定义src/widgets/zabbix/widget.js 定义了 API 基地址与映射const widget { api: {url}/api_jsonrpc.php, proxyHandler: jsonrpcProxyHandler, mappings: { trigger: { endpoint: trigger.get, params: { output: [triggerid, description, priority], filter: { value: 1, }, sortfield: priority, sortorder: DESC, monitored: true, }, }, }, };api中的{url}占位符会被替换为配置中的url最终请求地址形如http://zabbix.host.or.ip/zabbix/api_jsonrpc.phpmappings.trigger定义了一个名为trigger的映射对应 Zabbix API 方法trigger.get仅查询处于问题状态的触发器filter.value: 1即value1表示问题状态只取triggerid、description、priority三个输出字段并按优先级降序排列且monitored: true只统计受监控的主机/触发器。2. 代理转发src/utils/proxy/handlers/jsonrpc.js 是通用的 JSON-RPC 代理实现Homepage 中多个 JSON-RPC 类服务小组件共用。其工作流程为从前端请求中解析出group、service、endpoint参数通过 src/utils/config/service-helpers.js 的getServiceWidget获取对应小组件配置在 src/widgets/widgets.js 注册表中查找到该类型小组件的api与mappings取出对应映射的params使用json-rpc-2.0库构造 JSONRPCClient将方法名如trigger.get与参数封装为 JSON-RPC 2.0 请求通过 src/utils/proxy/http.js 的httpProxy以POST方式发出处理响应若 Zabbix 返回 JSON-RPC 错误对象json.error且result null则将其转换为可读错误正常结果以[200, application/json, JSON.stringify(response)]形式回传前端。该处理器还具备健壮的错误兜底JSON-RPC 错误异常会被捕获并转换为{ result: null, error: { code, message } }返回便于前端展示错误网络等非协议错误则返回 500 状态码并记录日志。3. 浏览器端安全模型前端组件通过useWidgetAPI请求 Homepage 的服务端 API 路由/api/widgets/endpoint系列见 src/pages/api/widgets/由服务端代理转发到 Zabbix。这意味着API Token 不会暴露给浏览器端鉴权完全发生在 Homepage 服务端与 Zabbix 之间适合将 Zabbix 内网地址与外部访问隔离的部署场景。小结Zabbix 小组件把 Zabbix 的触发器告警体系以最直观的数字块形式呈现在 Homepage 上一行 YAMLtypeurlkey即可接入 Zabbix 7.06 个严重级别字段按需挑选但最多同时显示 4 个默认 warning / average / high / disaster底层经由 Homepage 服务端 JSON-RPC 代理调用trigger.getToken 仅存于服务端安全可控计数、截断、错误处理等行为均有源码与测试双重佐证行为可预期。对于已有 Zabbix 监控体系、希望把告警状态聚合到统一导航页面的用户这是一个开箱即用且可定制程度适中的解决方案。【免费下载链接】homepageA highly customizable homepage (or startpage / application dashboard) with Docker and service API integrations.项目地址: https://gitcode.com/GitHub_Trending/ho/homepage创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 Homepage 集成 Zabbix 监控告警小组件：配置、字段与 JSON-RPC 原理详解
Homepage 集成 Zabbix 监控告警小组件配置、字段与 JSON-RPC 原理详解【免费下载链接】homepageA highly customizable homepage (or startpage / application dashboard) with Docker and service API integrations.项目地址: https://gitcode.com/GitHub_Trending/ho/homepage导读本文讲解如何在 Homepage高度可自定义的主页 / 启动页 / 应用仪表盘中接入 Zabbix 监控系统将 Zabbix 触发器按严重级别实时展示为告警计数小组件。阅读本文后你将掌握 Zabbix 小组件的完整配置方法URL、API Token、自定义显示字段、Zabbix 7.0 触发器在六种严重级别下的计数逻辑以及 Homepage 通过 JSON-RPC 代理调用 Zabbix API 的底层实现原理。相关文档位于 docs/widgets/services/zabbix.md配套源码位于 src/widgets/zabbix/。功能概述Zabbix 小组件是 Homepage 服务类小组件Services Widget之一用于在首页展示当前处于问题状态的触发器trigger数量并按严重级别分类统计。它把 Zabbix 的告警严重度体系未分类 / 信息 / 警告 / 平均 / 高 / 灾难直接映射为仪表盘上的数字块让运维人员无需打开 Zabbix 前端即可一眼掌握当前告警态势。从源码结构看该小组件与 Homepage 中其他服务小组件采用统一的三件套架构src/widgets/zabbix/widget.js定义 API 端点、代理处理器proxy handler与 API 映射mappings是小组件的数据契约src/widgets/zabbix/component.jsx负责数据获取与界面渲染配套的 src/widgets/zabbix/widget.test.js 与 src/widgets/zabbix/component.test.jsx通过 Vitest 验证配置结构合法性与渲染逻辑。快速配置在 Homepage 的services.yaml参见 src/skeleton/services.yaml 骨架示例中为某个服务分组添加如下配置widget: type: zabbix url: http://zabbix.host.or.ip/zabbix key: your-api-key配置字段说明字段必填说明type是固定为zabbix用于在 src/widgets/widgets.js 注册表中找到对应实现url是Zabbix 前端 Web 界面根地址须以/zabbix结尾或与你的 Zabbix 实际部署路径一致Homepage 会在其后拼接api_jsonrpc.phpkey是Zabbix API Token见下文获取 API Token获取 API Token原文档明确指出API Token 的生成方式请参阅 Zabbix 官方文档中Users → API tokens前端用户 API Token部分。在 Zabbix 前端中为相应用户创建 API Token 后将生成的 Token 填入key字段即可。文档同时声明该小组件至少支持 Zabbix server 7.0 版本。鉴权方式与源码印证从 src/utils/proxy/handlers/jsonrpc.js 的实现可以确认代理层支持两种鉴权模式if (widget?.username widget?.password) { headers.Authorization Basic ${Buffer.from(${widget.username}:${widget.password}).toString(base64)}; } if (widget?.key) { headers.Authorization Bearer ${widget.key}; }即配置key时以Bearer token方式鉴权推荐与 Zabbix 7.0 的 API Token 机制对应若同时配置username与password则退化为 HTTP Basic 鉴权。请求头还会显式设置content-type: application/json与accept: application/json符合 Zabbix JSON-RPC API 的要求。可显示字段与自定义小组件支持以下 6 个严重级别字段[unclassified, information, warning, average, high, disaster]它们与 Zabbix 触发器优先级priority的对应关系定义在 src/widgets/zabbix/component.jsx字段名Zabbix priority 值含义unclassified0未分类information1信息warning2警告average3平均high4高disaster5灾难关键限制同一时刻最多只能显示 4 个字段。默认显示widget: type: zabbix url: http://zabbix.host.or.ip/zabbix key: your-api-key fields: - warning - average - high - disaster若不配置fields默认即为[warning, average, high, disaster]跳过信息量较低的两档。该行为在 src/widgets/zabbix/component.jsx 中有明确实现if (!widget.fields) { widget.fields [warning, average, high, disaster]; } else if (widget.fields?.length 4) { widget.fields widget.fields.slice(0, 4); }注意如果用户配置超过 4 个字段组件会静默截断为前 4 个而非报错。渲染时每个字段对应一个Block其显示标签来自多语言文件 public/locales/en/common.json如warning→ Warning、disaster→ Disaster其他语言包public/locales/下的zh-Hans、ja、de等同样提供对应翻译。渲染逻辑与测试验证组件通过useWidgetAPI(widget, trigger)拉取数据src/components/services/widget/ 与 src/utils/proxy/use-widget-api.js 提供通用数据获取机制随后对返回的触发器列表按 priority 值分组计数const unclassified zabbixData.filter((item) item.priority PriorityUnclassified).length; const information zabbixData.filter((item) item.priority PriorityInformation).length; // ... 其余级别同理src/widgets/zabbix/component.test.jsx 中的测试用例直接验证了这套逻辑传入[{ priority: 2 }, { priority: 3 }, { priority: 3 }, { priority: 5 }]时期望输出 warning1、average2、high0、disaster1同时验证未配置fields时默认值被填充、未选中的字段unclassified / information不会渲染以及接口报错时展示错误 UIwidget.api_error。数据获取原理JSON-RPC 代理调用链Zabbix 的 API 基于 JSON-RPC 2.0 协议Homepage 通过内置的 JSON-RPC 代理处理器与其通信整个调用链清晰可循1. 端点定义src/widgets/zabbix/widget.js 定义了 API 基地址与映射const widget { api: {url}/api_jsonrpc.php, proxyHandler: jsonrpcProxyHandler, mappings: { trigger: { endpoint: trigger.get, params: { output: [triggerid, description, priority], filter: { value: 1, }, sortfield: priority, sortorder: DESC, monitored: true, }, }, }, };api中的{url}占位符会被替换为配置中的url最终请求地址形如http://zabbix.host.or.ip/zabbix/api_jsonrpc.phpmappings.trigger定义了一个名为trigger的映射对应 Zabbix API 方法trigger.get仅查询处于问题状态的触发器filter.value: 1即value1表示问题状态只取triggerid、description、priority三个输出字段并按优先级降序排列且monitored: true只统计受监控的主机/触发器。2. 代理转发src/utils/proxy/handlers/jsonrpc.js 是通用的 JSON-RPC 代理实现Homepage 中多个 JSON-RPC 类服务小组件共用。其工作流程为从前端请求中解析出group、service、endpoint参数通过 src/utils/config/service-helpers.js 的getServiceWidget获取对应小组件配置在 src/widgets/widgets.js 注册表中查找到该类型小组件的api与mappings取出对应映射的params使用json-rpc-2.0库构造 JSONRPCClient将方法名如trigger.get与参数封装为 JSON-RPC 2.0 请求通过 src/utils/proxy/http.js 的httpProxy以POST方式发出处理响应若 Zabbix 返回 JSON-RPC 错误对象json.error且result null则将其转换为可读错误正常结果以[200, application/json, JSON.stringify(response)]形式回传前端。该处理器还具备健壮的错误兜底JSON-RPC 错误异常会被捕获并转换为{ result: null, error: { code, message } }返回便于前端展示错误网络等非协议错误则返回 500 状态码并记录日志。3. 浏览器端安全模型前端组件通过useWidgetAPI请求 Homepage 的服务端 API 路由/api/widgets/endpoint系列见 src/pages/api/widgets/由服务端代理转发到 Zabbix。这意味着API Token 不会暴露给浏览器端鉴权完全发生在 Homepage 服务端与 Zabbix 之间适合将 Zabbix 内网地址与外部访问隔离的部署场景。小结Zabbix 小组件把 Zabbix 的触发器告警体系以最直观的数字块形式呈现在 Homepage 上一行 YAMLtypeurlkey即可接入 Zabbix 7.06 个严重级别字段按需挑选但最多同时显示 4 个默认 warning / average / high / disaster底层经由 Homepage 服务端 JSON-RPC 代理调用trigger.getToken 仅存于服务端安全可控计数、截断、错误处理等行为均有源码与测试双重佐证行为可预期。对于已有 Zabbix 监控体系、希望把告警状态聚合到统一导航页面的用户这是一个开箱即用且可定制程度适中的解决方案。【免费下载链接】homepageA highly customizable homepage (or startpage / application dashboard) with Docker and service API integrations.项目地址: https://gitcode.com/GitHub_Trending/ho/homepage创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考