服务注册表浏览器
概述
服务注册表浏览器是一个只读的服务发现工具,它像一个"内部 API 目录",为你展示当前应用里所有已注册工具服务的完整信息。当你需要了解某个工具提供了哪些能力、各方法的参数签名是什么、或者想查看某个工具是否实现了元数据接口时,不用再去翻源码,直接在这个工具里一目了然。
核心功能
- 自动发现所有已注册服务:启动后自动扫描并列出系统中所有已注册的工具服务,数量一目了然
- 可视化方法签名浏览:选中某个服务后,可展开查看其每个公开方法的参数名、类型、必填状态、默认值以及返回值类型
- 嵌套参数结构展示:当参数类型为复杂对象时,支持展开查看其内部属性的完整结构,包括嵌套的子属性
- 使用方法示例:对于提供了样例代码的方法,内置代码编辑器会高亮展示调用示例,方便快速复制参考
- 元数据实现状态检测:清晰标识每个服务是否已实现
getMetadata()方法,帮助开发者排查服务注册问题
快速上手
首次使用 4 步走
第一步:打开工具
在左侧工具列表中找到 服务注册表浏览器,点击进入。你会看到一个左侧为服务列表、右侧为详情面板的两栏布局界面。
TODO: 截图 - 工具整体界面,标注左侧服务列表和右侧详情面板
第二步:浏览已注册服务
左侧面板列出了当前系统中所有已注册的工具服务,每个条目显示其 服务 ID(等宽字体高亮)、名称 和 描述。面板顶部的标签会实时显示当前工具总数。
点击任意服务条目,右侧面板会立即切换到该服务的详细信息。
TODO: 截图 - 左侧服务列表,标注服务 ID、名称、描述和工具数量标签
第三步:查看服务基本信息
选中一个服务后,右侧详情面板顶部会展示该服务的 基本信息卡片:
- 服务 ID:服务的唯一标识符
- 服务名称:工具在 UI 中显示的友好名称
- 服务描述:工具的功能简介
- 元数据支持:表示该服务是否实现了
getMetadata()方法(绿色"已实现"或灰色"未实现")
TODO: 截图 - 右侧详情面板顶部,标注服务 ID、名称、描述和元数据支持状态
第四步:展开查看方法详情
如果服务已实现元数据接口,基本信息下方会显示 可用方法 区域,列出该服务的所有公开方法及数量。每个方法以可折叠面板展示,点击即可展开查看:
- 方法描述:方法的功能说明
- 参数列表:表格形式展示每个参数的名称、类型、是否必填、描述和默认值
- 返回值类型:以标签形式展示
- 使用示例:如果提供了示例代码,会通过代码编辑器高亮展示
TODO: 截图 - 展开某个方法后的详细内容,标注参数表格、返回值标签和代码示例
功能详解
服务列表(左侧面板)
左侧面板是整个工具的导航入口,它的结构和交互有以下几个要点:
工具数量统计
面板顶部的标题右侧附带一个标签,实时显示当前系统中已注册的工具总数。如果值为 0,标签变为灰色,下方会显示"暂无已注册的工具"的空状态提示。
服务条目展示
每个服务条目包含三部分信息:
| 信息 | 说明 |
|---|---|
| 服务 ID | 使用等宽字体(Consolas/Monaco)高亮显示,易于与代码中的引用对应 |
| 服务名称 | 工具在 UI 中的显示名称(可能为空) |
| 服务描述 | 工具的功能描述,最多显示两行,过长会被截断并显示省略号 |
选中状态
点击某个服务条目后,它会高亮显示(带主题色边框和背景),右侧面板同步切换为对应服务的详情。
TODO: 截图 - 对比未选中和选中状态的服务条目样式差异
服务详情面板(右侧面板)
右侧面板展示选中服务的详细信息,分为以下部分:
服务信息卡片
以 InfoCard 组件承载,使用 el-descriptions 表格布局展示:
- 服务 ID 以标签形式展示,更醒目
- 元数据支持状态以绿色/灰色标签区分
可用方法区域
只有服务实现了 getMetadata() 方法时才会显示此区域。方法列表使用 el-collapse 手风琴模式(一次只能展开一个方法):
参数表格:核心信息载体,展示以下列:
| 列 | 说明 |
|---|---|
| 参数名 | 参数的唯一名称 |
| 必填 | 红色"必填"标签或灰色"可选"标签 |
| 类型 | 参数类型名(如 string、number 或自定义类型),如果类型包含嵌套属性,旁边会显示"X 个"标签 |
| 描述 | 参数的功能说明 |
| 默认值 | 参数的默认值(如有) |
当类型为复杂对象时,点击该行前面的展开按钮,内部会以嵌套表格展示其子属性的完整结构:
TODO: 截图 - 展开复杂对象参数后展示嵌套属性表格
使用示例展示:对于提供了调用示例的方法,会通过 RichCodeEditor 组件以 JavaScript 语法高亮展示示例代码。代码只读,不可编辑。
TODO: 截图 - 使用示例代码高亮展示区域
空状态处理
工具在以下三种场景下会显示友好的空状态提示:
- 暂无已注册的工具:系统尚未注册任何工具服务时展示
- 请从左侧列表选择一个服务:刚打开工具尚未选择任何服务时展示
- 该服务尚未实现 getMetadata() 方法:选中服务但未提供元数据时展示
高级用法
快速验证服务注册状态
当你开发或调试新工具时,可以用此工具快速验证注册是否成功:
- 启动应用后,打开服务注册表浏览器
- 查看左侧列表中的工具总数是否增加了
- 找到新工具,检查其基本信息是否正确
- 展开方法列表,确认每个方法的参数签名是否与预期一致
跨工具协作参考
当你在使用其他工具(如 工具调用测试、API 测试工具)时,可以切换到服务注册表浏览器来快速查阅某个服务提供了哪些方法、各方法需要什么参数。这比翻阅源码文档要高效得多。
例如:
- 在 工具调用测试 中准备调用某个服务
- 切换到服务注册表浏览器找到该服务,查看其方法的参数签名和示例
- 再回到测试工具,根据获取到的信息正确填写参数
常见问题
Q:为什么我的工具没有出现在服务列表中?
这通常意味着该工具未正确注册。请检查以下几点:
- 工具目录下是否包含
.registry.ts文件 - 文件中是否正确导出了
toolConfig配置 - 如果工具是一个服务实现,是否已通过
toolRegistryManager.register()注册
Q:"元数据支持"显示为"未实现"是什么意思?
这说明该服务(ToolRegistry)没有实现 getMetadata() 方法。getMetadata() 是一个可选方法,用于向外部暴露服务的详细方法签名和参数信息。未实现此方法不会影响工具的正常运行,但在服务注册表浏览器中无法查看其方法详情。
Q:为什么有的参数行前面有一个展开按钮?
当参数的类型为复杂对象(如 GenerateTreeOptions 这类自定义类型)时,点击展开按钮可以查看该对象的内部属性列表。嵌套属性的结构与参数表格一致,也支持继续展开更深层的子对象。
Q:方法列表为什么一次只能展开一个?
右侧的可用方法列表使用了手风琴模式(Accordion),这是为了避免多个方法同时展开导致页面信息过载。如果你需要对比两个方法的详情,可以收起当前方法后再展开另一个。实际使用中,一次聚焦一个方法通常更高效。
Q:使用示例里的代码可以复制吗?
可以。示例代码由 RichCodeEditor 组件展示,虽然是只读模式,但你可以像在普通编辑器中一样选中并复制代码片段。