AWS 演示如何构建交互式 MCP 应用

AWS 发布了一篇技术教程，介绍如何构建在 AI 宿主应用中返回交互式界面、而不是纯文本的 MCP 应用。MCP Apps 扩展了 Model Context Protocol（MCP），让 HTML 组件直接在宿主应用内渲染，服务端则托管在 Amazon Bedrock AgentCore 上。

AgentCore runtime 提供无服务器、会话隔离并原生支持 MCP 的托管环境；AgentCore Gateway 则通过一个安全端点对外暴露服务，支持 MCP Apps 的宿主应用可直接接入。

示例应用

示例应用 Unicorn Rentals 提供独角兽租赁。用户提问“能展示所有独角兽吗”，宿主应用会为每只独角兽渲染一张交互卡片，包含图片、名称、描述、小时费率和可用状态。说出“我想预订 Stardust”后，应用记录预订并返回预订编号、日期和小时费率。查询进行中的租赁时，返回的是时长和已产生的费用，形式为文本而非卡片，AWS 指出并非每个请求都需要富界面。归还环节则按时长与小时费率计算总费用。

由于 MCP Apps 是与宿主无关的标准，AWS 表示同一个服务端在 ChatGPT、Claude 以及其他支持该扩展的宿主中体验一致。

实现方式

该应用用 TypeScript 编写，基于官方 @modelcontextprotocol/sdk 以及负责组件分发的 @modelcontextprotocol/ext-apps 扩展，以 Express.js HTTP 服务形式运行，由 AgentCore runtime 在内部管理。业务逻辑放在单独的 AWS Lambda 函数中，数据持久化使用 Amazon DynamoDB。

工具通过 registerAppTool 注册，包括 list_unicorns、book_unicorn、view_bookings 和 return_unicorn。工具配置中的 _meta.ui.resourceUri 字段告诉宿主渲染哪个组件，响应中的 structuredContent 则携带注入组件的数据。组件通过 registerAppResource 注册为 MCP 资源。部署时先将代码打包为 zip 上传至 Amazon S3，再创建 AgentCore runtime 资源，配置 NODE_22 环境、入口点和 MCP 协议模式。

完整细节与代码见 AWS 博客文章。