跳到主要内容

AG-UI 协议背后团队打造

CopilotKit 把生成式界面、共享状态与人机协同接入 React、Vue、Angular、React Native、Slack 与 Teams。

官方交互流程图:用户经界面与运行时,通过 AG-UI 协议连接智能体,共享状态、生成式界面、线程等能力贯穿两侧

运行时事件

  • 工具调用searchFlights({ from: "PVG", to: "NRT" })
  • 状态写入agent.setState({ city: "杭州" })
  • 等待确认智能体已暂停,等待你的批准

一个智能体后端,覆盖你已经在用的前端框架与智能体框架。AG-UI 负责线缆协议,各框架包负责界面层。

它是横向连接层

CopilotKit 是一个用于构建全栈智能体应用、生成式界面与聊天应用的 SDK。它最初是一个 React 库,如今站在你的智能体与用户之间。

同一个智能体,既能驱动 Web 应用,也能驱动移动应用,以及团队日常工作的 Slack 与 Microsoft Teams 工作区。你的智能体逻辑不需要改动。

我们正是 AG-UI 协议背后的团队。该协议已被 Google、LangChain、AWS、Microsoft、Mastra、PydanticAI 采用。

阅读 AG-UI 协议

先跑一遍真实的回路

这不是录屏。下面的面板是一个实际在运行的组件,会依次演示工具调用、生成式界面、共享状态与人机协同审批。

研究助手

还没有对话。选一个场景跑一遍。

这是一个真实运行的最小回路:工具调用、生成式界面、共享状态与人机协同审批。

七块能力,同一个回路

这些能力不是七件独立的产品。聊天、工具、界面、状态与审批共享同一条事件通道,所以任何一处变化都会立刻反映到其余部分。

Chat UI

聊天界面

完全可定制的聊天界面,支持消息流式输出、工具调用与智能体响应。

Generative UI

生成式 UI

智能体根据用户意图与自身状态,在运行时动态生成并更新界面组件。

Backend Tool Rendering

后端工具渲染

智能体调用后端工具,把返回的组件直接渲染到客户端。

Shared State

共享状态

一个同步的状态层,智能体与界面组件都能实时读取与写入。

Human-in-the-Loop

人机协同

智能体在执行途中暂停,请求确认或编辑后再继续下一步。

Rich Threads

富线程

对话跨越刷新、设备与会话留存,其中生成式界面完好无损。

Automatic Learning

自动学习

已完成的线程转化为经过评审的技能,不需要微调管线。

闭环,而不是流水线

CopilotKit 把界面、智能体与工具接进同一个交互回路。每一步的输出都能成为下一步的输入。

  • 智能体可以向用户请求输入

    流式输出、审批、表单编辑

  • 工具可以渲染界面

    组件直接在客户端渲染

  • 跨步骤、跨会话的有状态工作流

    步骤之间保留上下文

  • 一个智能体,部署到多处

    Web、移动端与聊天平台

适配你的技术栈

一个智能体后端,覆盖所有前端。同一份智能体逻辑,在不同框架与渠道上跑同一套交互。

平台状态快速上手
React / Next.jsGA快速开始
Angular已支持查看源码
Vue已支持查看源码
React Native已支持快速开始
Slack / Microsoft Teams已支持渠道文档
Discord / WhatsApp / Telegram适配器渠道文档
Google Chat / iMessage / SMS路线图渠道路线图

你的智能体逻辑保持不变。AG-UI 负责线缆协议,CopilotKit 负责各框架与各渠道的界面层。了解 AG-UI 协议

AG-UI 官方文档截图(已裁剪):你的应用经协议接入 LangGraph、LlamaIndex、Mastra 等智能体框架
图源自 AG-UI 官方文档,已裁掉浏览器外框
use-agent.tsx
// 以编程方式访问并控制你的智能体
const { agent } = useAgent({ agentId: "my_agent" });

// 渲染并更新智能体的状态
return (
  <div>
    <h1>{agent.state.city}</h1>
    <button onClick={() => agent.setState({ city: "杭州" })}>
      设置城市
    </button>
  </div>
);

useAgent 钩子

  • 状态双向可写

    界面写入 agent.setState,智能体下一次读取时拿到的是同一个值。

  • 完整的编程控制

    不需要把所有判断塞进提示词,条件分支留在代码里更可靠。

  • 直接构建在 AG-UI 之上

    useAgent 暴露的就是协议层,没有额外的抽象要绕过。

阅读 useAgent 文档

生成式界面的三种类型

生成式界面不是单选题。治理成本与自由度之间要取一个位置,下面三种类型对应三个不同的位置。

前端先注册好一组界面组件,智能体只返回组件名与参数。组件集合可控,渲染结果可预测。

自由度最低,治理成本最低。适合表单、列表这类结构稳定的界面。

阅读 AG-UI 协议 文档
示意
{
  "type": "component",
  "name": "FlightBoard",
  "props": {
    "origin": "PVG",
    "destination": "NRT"
  }
}
官方对比表:静态、开放式、声明式三种生成式界面的代表做法、优势与代价
官方对比:三种生成式界面的取舍各不相同

Intelligence 智能增强

它兼容你现有的 CopilotKit 应用与智能体框架,既可以使用托管平台,也可以部署到你自己的基础设施里。

了解 Intelligence

  • 01Rich Threads

    富线程

    对话跨越刷新、设备与会话留存,消息、生成式界面与实时运行记录都原样恢复。

  • 02User Memories

    用户记忆

    跨对话持久保存事实与偏好,按语义召回,而不是关键词匹配。

  • 03Automatic Learning

    自动学习

    已完成的线程转化为有据可循的洞察,以及经评审、可复用的技能。

  • 04Self-hosting

    私有化部署

    同一套平台,运行在你自己的 Kubernetes 集群、VPC 或数据边界之内。

  • 05Product Analytics

    产品分析

    从同一份交互数据里,看清智能体在做什么,用户在哪里真正获得价值。

一次编写,处处运行

Channels SDK 把你已经构建好的智能体直接投放到用户常驻的聊天应用。同样的工具、同样的共享状态、同样的人机协同,不需要重写。

查看全部渠道

  • SLACK

    Slack

    已支持

    智能体作为一等公民的 Slack 应用,线程、工具调用与审批都在频道内完成。

  • TEAMS

    Microsoft Teams

    已支持

    把智能体工作流带进企业级场景,也就是组织本就活跃的地方。

  • DISCORD

    Discord

    SDK 适配器可用,托管连接即将推出

    同样的工具、同样的共享状态、同样的审批流,不需要重写智能体。

  • WHATSAPP

    WhatsApp

    SDK 适配器可用,托管连接即将推出

    直接接入已有会话,面向终端用户的场景不需要再做一个应用壳。

  • TELEGRAM

    Telegram

    SDK 适配器可用,托管连接即将推出

    轻量渠道,适合通知、审批与一对一的任务确认。

官方渠道矩阵:同一智能体可投放的聊天渠道与可接入的智能体框架一览

先接一个智能体,再谈规模

从一条命令开始,让编程智能体帮你检查项目并完成接入。有问题可以直接在社区里问。

npx --yes copilotkit@latest onboard start

CopilotKit