隨著 AI Agent 在企業(yè)中應(yīng)用越來(lái)越廣，AI Agent 在落地過(guò)程中，MCP 解決了 AI Agent 到 Tools 之間的通信標(biāo)準(zhǔn)，A2A 解決了 AI Agent 到 AI Agent 之間的通信標(biāo)準(zhǔn)。但是仍缺少一塊：用戶到 AI Agent 的通信協(xié)議。

AG-UI 協(xié)議橫空出世，專為解決前端應(yīng)用與 AI Agent 的通信交互而設(shè)計(jì)。

AG-UI 讓你能夠輕松地在網(wǎng)頁(yè)、APP、應(yīng)用程序或嵌入式設(shè)備中集成 AI 助手、AI 客服和智能問(wèn)答 UI，避免了為每個(gè)應(yīng)用程序重復(fù)開(kāi)發(fā)基礎(chǔ)功能的麻煩，也省去了處理交互邏輯的煩惱。

AG-UI 完善了 AI 協(xié)議棧，專注于構(gòu)建 AI Agent 與用戶前端之間的橋梁。它采用事件驅(qū)動(dòng)的設(shè)計(jì)，定義了16種標(biāo)準(zhǔn)事件，并支持 SSE、WebSocket 和 Webhook 等傳輸方式，與 LangGraph、CrewAI 等框架兼容。

它就像是為你的前端安裝了一個(gè) AI “大腦”，無(wú)需綁定到特定的模型或框架，一套協(xié)議就能滿足所有的交互需求。

為什么需要 AG-UI？

每個(gè) AI Agent 后端都有自己的工具調(diào)用、ReAct 樣式規(guī)劃、狀態(tài)差異和輸出格式機(jī)制。

如果你使用 LangGraph，前端將實(shí)現(xiàn)自定義的 WebSocket 邏輯、雜亂的 JSON 格式和特定于 LangGraph 的 UI 適配器。

但要遷移到 CrewAI/Dify 等，一切都必須進(jìn)行調(diào)整，這樣工作量大大增加。

Github 地址：

??    https://github.com/ag-ui-protocol/ag-ui??

使用文檔地址：

??    https://docs.ag-ui.com/introduction??

下文對(duì) AG-UI 詳細(xì)剖析之。

AG-UI 架構(gòu)設(shè)計(jì)剖析

第一、AG-UI 架構(gòu)設(shè)計(jì)

AG-UI 使用一個(gè)輕量級(jí)、事件驅(qū)動(dòng)的協(xié)議來(lái)連接 AI Agents 和前端應(yīng)用程序，架構(gòu)設(shè)計(jì)如圖所示：

• Front-end：通過(guò) AG-UI 進(jìn)行通信的應(yīng)用（聊天或任何啟用 AI 應(yīng)用） ；
• AI Agent A：前端可以直接連接的 AI Agent，無(wú)需通過(guò)代理；
• Secure Proxy：一個(gè)中介代理，安全地將前端的請(qǐng)求路由到多個(gè) AI Agents；
• AI Agent B 和 C：由代理服務(wù)管理的 AI Agents。

第二、AG-UI 工作機(jī)制

AG-UI 的核心工作機(jī)制非常簡(jiǎn)潔而優(yōu)雅，如下圖所示：

• 客戶端通過(guò) POST 請(qǐng)求啟動(dòng)一次 AI Agent 會(huì)話；
• 隨后建立一個(gè) HTTP 流（可通過(guò) SSE/WebSocket 等傳輸協(xié)議）用于實(shí)時(shí)監(jiān)聽(tīng)事件；
• 每條事件都有類型和元信息（Metadata）；
• AI Agent 持續(xù)將事件流式推送給 UI；
• UI 端根據(jù)每條事件實(shí)時(shí)更新界面；
• 與此同時(shí)，UI 也可反向發(fā)送事件、上下文信息，供 AI Agent 使用。
  

AG-UI 不再是單向的信息流，而是一種真正的雙向“心跳式”交互機(jī)制。AG-UI 就像 REST 是客戶端到服務(wù)器請(qǐng)求的標(biāo)準(zhǔn)一樣，AG-UI 將實(shí)時(shí) AI Agent 更新流式傳輸回 UI 的標(biāo)準(zhǔn)。從技術(shù)上講，AG-UI 使用服務(wù)器發(fā)送事件（SSE）將結(jié)構(gòu)化 JSON 事件流式傳輸?shù)角岸恕?/p>

每個(gè)事件都有一個(gè)顯式的有效負(fù)載（比如：Python 字典中的 keys）：

• TEXT_MESSAGE_CONTENT 用于令牌流式處理；
• TOOL_CALL_START 以顯示工具執(zhí)行情況；
• STATE_DELTA 更新共享狀態(tài)（代碼、數(shù)據(jù)等）；
• AGENT_HANDOFF 在 AI Agent 之間順利傳遞控制權(quán)。

并且 AG-UI 帶有 TypeScript 和 Python 的 SDK，即插即用適用于任何技術(shù)棧，如下圖所示：

在上圖中，來(lái)自 AI Agent 的響應(yīng)并不特定于任何工具包。這是一個(gè)標(biāo)準(zhǔn)化的 AG-UI 響應(yīng)。

AG-UI 提供了前端 TypeScript 和后端 Python 的 SDK，可無(wú)縫接入到現(xiàn)有 AI Agent 代碼中，核心模塊包括：

• RunAgentInput：運(yùn)行 AI Agent 的輸入?yún)?shù)；
• Message：用戶助手通信和工具使用；
• Context：提供給 AI Agent 的上下文信息；
• Tool：定義 AI Agent 可以調(diào)用的函數(shù)；
• State：AI Agent 狀態(tài)管理。

1.前端接入

npm install @ag-ui/core
npm install @ag-ui/client

2.后端 Python 端接入

from ag_ui.core import TextMessageContentEvent, EventType
from ag_ui.encoder import EventEncoder
# Create an event
event = TextMessageContentEvent(
    type=EventType.TEXT_MESSAGE_CONTENT,
    message_id="msg_123",
    delta="Hello, world!"
)
# Initialize the encoder
encoder = EventEncoder()
# Encode the event
encoded_event = encoder.encode(event)
print(encoded_event)
# Output: data: {"type":"TEXT_MESSAGE_CONTENT","messageId":"msg_123","delta":"Hello, world!"}\n\n

第三、AG-UI 關(guān)鍵特性

• ?? 輕量級(jí)：設(shè)計(jì)簡(jiǎn)單，易于理解與擴(kuò)展；
• ?? 支持多種傳輸協(xié)議：Server-Sent Events（SSE）、WebSocket、Webhook 任你選擇；
• ?? 真正雙向同步：支持實(shí)時(shí)對(duì)話、工具調(diào)用、上下文更新等；
• ?? 框架無(wú)關(guān)：LangGraph、CrewAI、Mastra 等框架均可無(wú)縫對(duì)接；
• ??? 寬松的 Schema 匹配策略：低耦合、高兼容，降低開(kāi)發(fā)門檻；
• ?? 即插即用：開(kāi)源協(xié)議，前端（比如：React/Vue）快速集成無(wú)門檻。

第四、AG-UI、A2A、MCP 協(xié)議對(duì)比

AG-UI 明確且專門針對(duì) AI Agent-用戶交互層。它不與諸如 A2A（AI Agent 到 AI Agent 協(xié)議）和 MCP（模型上下文協(xié)議）等協(xié)議競(jìng)爭(zhēng)。

比如：同一個(gè) AI Agent 可能通過(guò) A2A 與另一個(gè) AI Agent 通信，同時(shí)通過(guò) AG-UI 與用戶通信，同時(shí)調(diào)用由 MCP Server 提供的工具。

這些協(xié)議在 AI Agent 生態(tài)系統(tǒng)中起到互補(bǔ)的作用：

• AG-UI：處理人在循環(huán)中的交互和流式 UI 更新；
• A2A：促進(jìn) AI Agent 到 AI Agent 之間的通信和協(xié)作；
• MCP：在不同模型之間標(biāo)準(zhǔn)化工具調(diào)用和上下文處理。

本文轉(zhuǎn)載自??玄姐聊AGI??  作者：玄姐