演示程序

演示程序 (Demo Web App)

我们提供了一个演示 Web 应用程序，用于展示 Agent 如何通过 A2A 协议进行相互通信。

架构概述

• 前端: 一个基于 Mesop 的 Web 应用程序，负责渲染最终用户与"主机 Agent (Host Agent)“之间的对话内容。该应用可以渲染文本、思考气泡、Web 表单（用于 Agent 请求输入）和图像等。更多内容类型即将推出。
• 主机 Agent (Host Agent): 一个 Google ADK Agent，负责协调用户请求并将其委派给远程 Agent。
• 远程 Agent (Remote Agent): 每个远程 Agent 都是运行在 Google ADK Agent 内部的 A2A Client。它会获取 A2A Server 的 AgentCard，然后使用 A2A 协议代理所有请求。

主要特性

• 动态添加 Agent: 点击 Web 应用中的机器人图标，可以输入远程 Agent 的 AgentCard 地址，应用将获取该 Card 并将其添加到已知的 Agent 列表中。
• 与一个或多个 Agent 对话: 点击聊天按钮开始或继续对话。请求将发送给 Host Agent，后者会将其委派给一个或多个远程 Agent。
• 复杂内容渲染: 如果 Agent 返回复杂内容（如图像或 Web 表单），前端将在对话视图中渲染它们。远程 Agent 负责在 A2A 格式和 Web 应用的原生表示之间进行转换。
• 探索 A2A 任务: 点击历史记录可以查看 Web 应用与所有 Agent（Host Agent 和 Remote Agent）之间发送的消息。点击任务列表可以查看来自远程 Agent 的所有 A2A 任务更新。

先决条件

• Python 3.12 或更高版本
• UV (包管理工具)
• 运行中的、支持 A2A 协议的 Agent Server (可以使用 Python 示例 Agent 中的代码)

如何运行 Demo

1. 导航到 Demo UI 目录:

   # 假设在 a2a-protocol 仓库根目录
   cd a2acn/_docs/docs/demo/ui
2. 创建包含您的 API 密钥的环境文件:

   echo "GOOGLE_API_KEY=your_api_key_here" > .env
3. 运行前端示例:

   uv run main.py

注意: 应用程序默认在端口 12000 上运行。

要了解 Demo 中使用的 UI 组件，请参考 UI 组件库 页面。