A2UI：一种用于代理驱动接口的协议

Source: Hacker News

[Image: A2UI Logo]

面向代理的界面协议

A2UI 使 AI 代理能够生成丰富的交互式用户界面，这些界面可以在 Web、移动端和桌面端原生渲染——且无需执行任意代码。

状态： 早期公开预览
A2UI 当前为 v0.8（公开预览）。规范和实现已经可用，但仍在演进中。我们开放项目以促进协作、收集反馈并征求贡献（例如客户端渲染器）。请预期会有更改。

一览

• 版本： v0.8
• 许可证： Apache 2.0
• 创建者： Google，携手 CopilotKit 与开源社区贡献
• 代码仓库： 在 GitHub 上积极开发

解决的问题： 如何让 AI 代理在信任边界之间安全地发送丰富的 UI？
与仅文本响应或风险代码执行不同，A2UI 让代理发送 声明式组件描述，客户端使用自己的原生部件渲染——这是一种通用 UI 语言。

关键优势

• 安全设计 – 声明式数据格式，而非可执行代码。代理只能使用您目录中预先批准的组件，防止 UI 注入攻击。
• 友好 LLM – 扁平、流式的 JSON 结构，便于生成。LLM 可以增量构建 UI，无需一次性生成完整 JSON。
• 框架无关 – 同一条代理响应可在任何地方使用。使用 Angular、Flutter、React 或原生移动端的自定义样式组件渲染相同 UI。
• 渐进渲染 – 在生成时流式传输 UI 更新。用户可以实时看到界面逐步构建，而不是等待完整响应。

5 分钟快速入门

• 快速入门指南 – 运行餐厅搜索演示，观看 Gemini 驱动的代理实际运行 A2UI。
• 核心概念 – 了解表面、组件、数据绑定以及邻接表模型。
• 开发者指南 – 将 A2UI 渲染器集成到您的应用，或构建生成 UI 的代理。
• 协议参考 – 深入完整技术规范和消息类型。

工作原理

1. 用户向 AI 代理发送消息。
2. 代理生成描述 UI（结构 + 数据）的 A2UI 消息。
3. 消息流式传输到客户端应用。
4. 客户端使用原生组件（Angular、Flutter、React 等）渲染。
5. 用户与 UI 交互，将操作发送回代理。
6. 代理响应更新的 A2UI 消息。

A2UI 实际案例

景观设计师演示

观看代理为景观设计应用生成全部界面。用户上传照片，代理使用 Gemini 理解图片并生成定制的园林需求表单。

Your browser does not support the video tag.

自定义组件：交互式图表与地图

观看代理先返回图表组件以回答数值摘要问题，随后返回 Google 地图组件以回答位置问题。两者均为客户端提供的自定义组件。

Your browser does not support the video tag.

A2UI 组合器

CopilotKit 提供了一个公开的 A2UI 小部件构建器，您可以尝试使用。