MCP Apps 讓代理工具輸出變成產品介面
Tech

MCP Apps 讓代理工具不只回傳文字,也能宣告 UI 資源,由宿主在對話中的 sandbox iframe 內渲染。Nuxt MCP Toolkit 的支援代表這個模式正進入一般前端元件工作流。
發生了什麼
團隊需要區分給模型閱讀的摘要與只供 UI 使用的詳細資料。任何會改變狀態的按鈕,都應該有使用者同意、稽核紀錄與失敗復原設計。
Practical checklist
- Keep the tool schema stable before designing the widget.
- Separate model-readable summaries from UI-only detailed data.
- Require explicit consent and logs for state-changing actions.
- Test iframe sandboxing, CSP, CORS and OAuth redirects in the real host.
- Track UI actions, tool calls and failures in one trace.
適合事故排查、部署核准、成本看板與文件審閱。不適合簡短問答。MCP Inspector 只是基準,真實宿主中的 CORS、OAuth 與 iframe 政策必須另外驗證。
The practical conclusion is simple: treat MCP Apps as a product surface for high-friction agent workflows, not as decoration for every tool response.
來源
- Model Context Protocol Blog: MCP Apps - Bringing UI Capabilities To MCP Clients
- Model Context Protocol Docs: MCP Apps overview
- Model Context Protocol SEPs index: SEP-1865 status
- Vercel Changelog: Nuxt MCP Toolkit now supports MCP apps
- Nuxt MCP Toolkit documentation
- Microsoft Learn: Add interactive UI widgets to declarative agents
- Microsoft Q&A: MCP Apps UI does not render in Copilot 365 Chat, used as practitioner signal
- Reddit r/ClaudeAI thread on MCP Apps traction, used as community signal