用途:在标准 MCP 服务器之上添加 UI 资源,使工具结果在聊天界面内以内嵌组件(widget)渲染。UI 层是附加的,底层仍是 tools、resources 与同一线协议;已有 build-mcp-server 技能覆盖基础层,本技能只负责加 widget。
主要能力:通过 registerAppTool 的 _meta.ui.resourceUri 声明工具对应的 ui:// 资源,另用 registerAppResource 单独提供 HTML;资源 MIME 必须是 RESOURCE_MIME_TYPE。widget 内用 @modelcontextprotocol/ext-apps 的 App 类与宿主双向通信,支持 ontoolresult、ontoolinput、sendMessage、updateModelContext、callServerTool、openLink、requestDisplayMode、downloadFile 等,并可通过 hostContext 跟随宿主主题与安全区。
何时值得加 widget:需要结构化输入、从大/可搜索列表中挑选、破坏性或计费操作确认、可视化输出、长时间任务进度。若需求能被 elicitation 覆盖(是否确认、短枚举、扁平表单),优先用 elicitation。
部署形态:远程 MCP 应用(streamable-HTTP,最常见)或 MCPB 打包的本地应用(需驱动本地磁盘或桌面应用时)。安装示例:npm install @modelcontextprotocol/sdk @modelcontextprotocol/ext-apps zod express。测试可在 Claude Desktop 用 mcp-remote 加 --allow-http --transport http-only,桌面会缓存 UI 资源,改 HTML 后需完全退出重启;也可用 JSON-RPC 行循环做无界面测试。
限制:widget 无法访问宿主 DOM、cookie、存储;网络受 CSP 限制,需经 callServerTool 转发;弹窗与直接跳转被沙箱阻止,须用 app.openLink;远程图片需服务端内联为 data: URL。宿主不支持 apps 时会忽略 _meta.ui 并正常渲染工具的文本内容。