字节笔记本
2026年2月21日
A2UI:Google 开源的 Agent-to-User Interface 框架
A2UI 是 Google 开源的创新项目,提供标准化 JSON 格式和渲染器库,让 AI Agent 能够生成丰富的可交互用户界面。支持 Flutter、Angular、Lit 等框架,确保 Agent 生成的 UI "像数据一样安全,像代码一样富有表现力"。
项目简介
A2UI(Agent-to-User Interface)是一个开源项目,包含优化的格式和初始渲染器集合,允许智能体生成或填充丰富的用户界面。该项目在 GitHub 上已获得 11.4k stars,目前有 858 forks,由 36 位贡献者 共同维护。
A2UI 解决了生成式 AI 在创建文本和代码方面的优势与智能体在向用户展示丰富交互界面时的困难之间的矛盾,特别是当这些智能体是远程运行或跨越信任边界时。
核心特性
1. 安全优先
运行 LLM 生成的任意代码可能存在安全风险。A2UI 采用声明式数据格式而非可执行代码。客户端应用程序维护一个"目录",包含受信任的预批准 UI 组件(如 Card、Button、TextField),智能体只能请求渲染目录中的组件。
2. LLM 友好且可增量更新
UI 被表示为带有 ID 引用的扁平组件列表,这种格式易于 LLM 增量生成,支持渐进式渲染和响应式用户体验。智能体可以根据对话进展中的新用户请求高效地对 UI 进行增量更改。
3. 框架无关且可移植
A2UI 将 UI 结构与 UI 实现分离。智能体发送组件树及其关联数据模型的描述,客户端应用程序负责将这些抽象描述映射到其原生组件,无论是 Web 组件、Flutter 组件、React 组件、SwiftUI 视图还是其他框架。来自智能体的相同 A2UI JSON 负载可以在构建于不同框架之上的多个不同客户端上渲染。
4. 灵活性
A2UI 具有开放的注册表模式,允许开发者将服务器端类型映射到自定义客户端实现,从原生移动组件到 React 组件。通过注册"Smart Wrapper",可以将任何现有 UI 组件(包括用于遗留内容的安全 iframe 容器)连接到 A2UI 的数据绑定和事件系统。这直接将安全控制权交到开发者手中,使他们能够在自定义组件逻辑中强制执行严格的沙箱策略和"信任阶梯"。
技术栈
| 技术 | 占比 | 用途 |
|---|---|---|
| TypeScript | 77.7% | 核心库和渲染器实现 |
| Python | 19.7% | Agent 示例和工具 |
| HTML | 1.3% | 文档和示例 |
架构设计
A2UI 流程将 UI 的生成与执行分离:
- 生成:智能体(使用 Gemini 或其他 LLM)生成或使用预生成的
A2UI Response,这是一个描述 UI 组件组合及其属性的 JSON 负载 - 传输:通过 A2A、AG UI 等协议将此消息发送到客户端应用程序
- 解析:客户端的 A2UI Renderer 解析 JSON
- 渲染:渲染器将抽象组件(如
type: 'text-field')映射到客户端代码库中的具体实现
使用场景
- 动态数据收集:智能体根据对话的具体上下文生成定制表单(日期选择器、滑块、输入框),例如预订专业预约
- 远程子智能体:编排智能体将任务委托给远程专业智能体(如旅行预订智能体),该智能体返回要在主聊天窗口中渲染的 UI 负载
- 自适应工作流:企业智能体根据用户查询即时生成审批仪表板或数据可视化
快速开始
前置要求
- Node.js(用于 Web 客户端)
- Python(用于 Agent 示例)
- 有效的 Gemini API Key
运行 Restaurant Finder 演示
# 1. 克隆仓库
git clone https://github.com/google/A2UI.git
cd A2UI
# 2. 设置 API 密钥
export GEMINI_API_KEY="your_gemini_api_key"
# 3. 运行 Agent(后端)
cd samples/agent/adk/restaurant_finder
uv run .
# 4. 运行 Client(前端)- 新开终端窗口
# 安装并构建 Web Core 库
cd renderers/web_core
npm install
npm run build
# 安装并构建 Lit 渲染器
cd ../lit
npm install
npm run build
# 安装并运行 shell 客户端
cd ../../samples/client/lit/shell
npm install
npm run dev相关资源
- GenUI SDK:Flutter GenUI - 在底层使用 A2UI
- A2UI Widget Builder:CopilotKit 提供的在线构建器
- 官方文档:a2ui.org
项目状态
⚠️ 注意:A2UI 目前处于 v0.8(公开预览版)。规范和实现功能完整,但仍在演进中。项目开放是为了促进协作、收集反馈和征求贡献(例如在客户端渲染器方面)。预计会有变更。
路线图
- 规范稳定:向 v1.0 规范迈进
- 更多渲染器:增加对 React、Jetpack Compose、iOS(SwiftUI)等的官方支持
- 额外传输:支持 REST 等更多协议
- 额外 Agent 框架:支持 Genkit、LangGraph 等
许可证
A2UI 采用 Apache 2.0 许可证开源。项目团队相信 UI 的未来是智能化的,希望与社区共同构建这一未来。
项目链接
- GitHub 仓库:https://github.com/google/A2UI
- 官方网站:https://a2ui.org/
- 贡献指南:CONTRIBUTING.md