SuperAPI AI 工具集

mcp-visual-output

智能体与模型

查看项目

更新于 10-16 01:09

技能介绍

用途:为 MCP 服务器增加可视化输出层,让 AI 对话中直接渲染交互式仪表盘,而非返回纯文本或原始 HTML。基于 @json-render/mcp(上游版本参考 0.21.0),桥接 json-render spec 系统与 MCP 的 tool/resource 模型。

主要能力:用 defineCatalog() + Zod 定义类型化组件目录;createMcpApp() 新建服务器,或 registerJsonRenderTool() 为已有服务器注册渲染工具;registerJsonRenderResource()(0.15 起)单独提供打包好的 iframe HTML 资源;支持渐进式流式渲染(JSON Patch)、CSP 与 iframe 沙箱配置、仪表盘布局模式(统计网格、状态徽章、数据表)。AI 只生成结构化 JSON spec,按类型引用目录组件,不写 HTML/CSS。

使用方式:新建服务器用 createMcpApp({ name, version, catalog, html, tool }),再 connect 传输层(stdio 或 Streamable HTTP);已有服务器用 registerJsonRenderTool(server, { catalog, name, title, description, resourceUri }) 并配合 registerJsonRenderResource(server, { resourceUri, html })。iframe 端用 useJsonRenderApp() 取 spec,再用 <Renderer spec registry /> 渲染。

适用场景:多指标概览、5 行以上表格数据、多系统状态展示等适合可视化;单值答案、错误信息、文件或代码内容仍用纯文本。

限制:需先有可运行的 MCP 服务器;组件树建议保持扁平(2-3 层)以便流式渲染;目录组件类型建议 3-5 个以控制提示词成本;CSP 应最小化声明,避免 script-src 'unsafe-inline';createMcpApp() 必须提供 html bundle。具体收费、价格与平台支持范围资料未提供。