A2UI

谷歌近期开源了 A2UI（Agent-to-UI），一个旨在解决 AI 智能体与用户之间交互界面问题的开放标准。传统上，AI 智能体受限于文本或语音交互，难以提供结构化、可操作的图形界面。A2UI 的出现，首次为智能体提供了一种安全、高效、跨平台的方式，来“表述”并动态生成用户界面。

为什么需要 A2UI？

生成式 AI 擅长生成文本和代码，但在呈现丰富、交互式 UI 时存在明显短板——尤其是当智能体运行在远程环境、跨信任边界，或需要与不同前端框架集成时。

A2UI 提出了一种新思路：让智能体用声明式 JSON 描述 UI 的“意图”，而由客户端用自己的原生组件库（如 Flutter、React、Lit、SwiftUI 等）来渲染。这种方式实现了 “像数据一样安全，像代码一样有表现力” 的平衡。

核心设计原则

1. 安全第一

A2UI 不是可执行代码，而是一种声明式数据格式。客户端维护一个“受信任组件目录”（如 Button、Card、TextField），智能体只能请求使用目录中的组件。这从根本上避免了 LLM 生成恶意 UI 代码的风险。

2. 对大模型友好，支持增量更新

UI 被表示为带 ID 引用的扁平组件列表，便于 LLM 逐步生成或修改。这意味着：

• 支持渐进式渲染（先显示骨架，再填充内容）
• 支持对话中动态更新界面（例如用户修改筛选条件后，智能体重绘表单）

3. 框架无关，跨平台可移植

智能体只需输出统一的 JSON payload，客户端负责将其映射到自身 UI 框架：

• Web：Lit、Angular、React
• 移动：Flutter、SwiftUI、Jetpack Compose
• 同一份 A2UI 数据，可在不同平台渲染出原生体验。

4. 高度可扩展

通过 “开放注册”机制，开发者可以将任意自定义组件（甚至封装在 iframe 中的遗留系统）接入 A2UI 的数据绑定与事件系统。
更重要的是，安全策略由开发者控制——你可以在自己的组件中实现沙箱、权限校验或“信任阶梯”，而不依赖 A2UI 核心。

典型应用场景

• 动态表单生成
  智能体根据上下文（如“预订带宠物的酒店”）自动生成包含日期选择器、宠物类型下拉、特殊需求输入框的表单。
• 远程子智能体集成
  主智能体将“订机票”任务委派给旅行子智能体，后者返回一个 A2UI 界面，在主聊天窗口中直接渲染航班选择面板。
• 企业级自适应工作流
  企业智能体根据查询（如“审批Q3市场预算”）动态生成带审批按钮、预算图表、评论区的仪表板。

系统架构

A2UI 将 UI 的生成与执行彻底分离：

1. 生成：智能体（如基于 Gemini）输出 A2UI JSON，描述组件结构与数据。
2. 传输：通过 A2A 协议、AG UI 或未来支持的 REST 等方式发送至客户端。
3. 解析：客户端 A2UI 渲染器解析 JSON。
4. 渲染：将抽象组件（如 type: "button"）映射为本地框架的具体实现。

快速体验

前提条件

• Node.js（用于 Web 客户端）
• Python（用于智能体示例）
• 有效的 Gemini API Key

运行“餐厅查找器”演示

# 克隆仓库
git clone https://github.com/google/A2UI.git
cd A2UI

# 设置 API Key
export GEMINI_API_KEY="your_gemini_api_key"

# 启动智能体（后端）
cd samples/agent/adk/restaurant_finder
uv run .

# 启动 Lit 客户端（前端）
cd ../../samples/client/lit/shell
npm install
npm run dev

Flutter 开发者可关注 GenUI SDK（底层基于 A2UI）。
另有 CopilotKit 提供的 A2UI 小部件构建器 可在线试用。

未来路线图

谷歌希望与社区共同推进：

• 规范稳定化：向 v1.0 迈进
• 扩展渲染器：官方支持 React、Jetpack Compose、SwiftUI
• 丰富传输方式：增加 REST 等协议支持
• 集成更多智能体框架：如 Genkit、LangGraph

项目采用 Apache 2.0 许可证，欢迎贡献代码、反馈或用例。