CopilotKit
CopilotKit · 程式設計 · 聊天機器人
CopilotKit 是開源框架，讓你在自家產品裡加入 AI 代理，為 React、Angular 與行動 App 提供對話、代理動作與生成式介面。
關於 CopilotKit
About
什麼是 CopilotKit
CopilotKit 是連接應用程式畫面與 AI 代理的開發框架。你不必從頭打造對話視窗、串流輸出與工具呼叫，只要在專案裡放進供應器元件和對話元件，其餘的線路交給框架處理。它從 React 函式庫起家，如今涵蓋 React、Angular、Vue、React Native 與 iOS，也能接上 Slack、Teams 與 WhatsApp。
它補上的是最後一哩路。不少團隊後端已經有可用的代理，卻沒有合適的方式把它的工作呈現在產品裡。CopilotKit 提供現成對話介面、把應用程式狀態交給代理的 hook，以及讓代理呼叫的動作註冊機制，於是副駕駛能在使用者眼前的畫面上排序表格、開啟記錄或填寫表單。
團隊同時維護 AG-UI，這是一套開放的的事件驅動協定，用來串接代理後端與前端。如果你打算日後更換代理框架，又不願重做介面，這層設計就很重要。SDK 以 MIT 授權釋出。託管的執行環境 CopilotKit Intelligence 屬於付費產品，依對話串、儲存空間與 Slack 額度計費。
有三個限制值得先看清楚。框架假設應用程式由程式碼寫成，無程式碼團隊派不上用場。免費的託管方案上限是 200 條對話串、保留三天。自動學習與分析標示為搶先體驗，行為仍可能變動。
開始使用
- 在既有專案安裝 SDK，或從 React、Angular、Vue、React Native 的官方範本起步。
- 用 CopilotKit 供應器包住整個應用程式，指向代理端點或託管執行環境。
- 用讀取 hook 宣告代理能看到什麼，用動作 hook 宣告它能執行什麼。
- 挑選呈現方式：側邊欄、彈出視窗，或完全無介面、接上自家設計系統的版本。
- 凡是會動到金流、資料或權限的動作，一律加上人工確認，再用真實使用流程測試。
產品資訊
快速了解 CopilotKit 的定價、支援平台與效能。
適合對象
這項工具最適合的使用者、任務與情境。
使用者
- 為產品加入副駕駛的前端開發者：對話、串流與工具呼叫都由 SDK 處理，團隊的時間留給產品行為。前提是熟悉 React 或 Angular。
- SaaS 公司的產品團隊：現成對話介面與生成式介面，讓熟悉設計系統的人主導副駕駛體驗。要有建置流程，不是拖拉就能完成。
- 同時維護多個代理後端的平台團隊：AG-UI 讓單一前端對接 LangGraph、CrewAI、Mastra 或 OpenAI Agents SDK，不必每次重寫介面。
- 打造內部工具的客服與營運部門：代理讀取眼前的記錄並執行已核准的動作，適合點錯一次代價很高的流程。
任務
- 在 App 內加入對話：放上 `<CopilotChat />` 元件、指定代理，再用自家 CSS 類別調整外觀。
- 讓代理在頁面上動手：註冊排序資料列或建立工單這類動作，代理就會呼叫你寫的處理函式。
- 呈現互動式回覆：代理回傳圖表、表單或卡片等真正的元件，而不是純文字。
- 加入核准流程：敏感動作前先插入人工確認，確認訊息直接出現在對話串中。
- 打造 Slack 或 Teams 助理：沿用同一條代理連線到頻道，不必另開一個機器人專案。
情境
- 針對畫面上資料回答問題的儀表板：代理從共享狀態讀取目前篩選條件，回傳已套用篩選的圖表。
- 需要轉交人工的客服主控台：代理先擬好回覆，由人員核准後才送出。
- 出錯代價高的財務或行政工具：核准機制與每個動作的稽核紀錄，讓流程事後可查。
- 新代理想法的快速原型：免費託管方案加上開源 SDK，在談預算之前就能跑出可用的示範。
主要功能
對話介面元件
函式庫內建多種對話介面：完整面板、側邊欄與彈出視窗。三者都支援串流回覆，也能直接處理生成式介面。訊息泡泡、輸入框這類子元件可透過插槽替換，副駕駛因此能沿用產品原本的樣貌，不必重寫。想要完全掌控，同樣的行為也以無介面 hook 的形式提供。
生成式介面
代理可以用真正的介面元素回答，而不是一段文字。CopilotKit 支援三種做法：受控模式下你預先定義元件，代理挑一個並填入資料；宣告模式下代理提出介面樹，由應用程式驗證；開放模式則能產生更自由的輸出。實際使用時，問一句供應商支出，回來的是一張套用自家樣式的圖表；提出退款申請，回來的是一份可直接送出的表單。
App 內動作與共享狀態
Hook 能把應用程式狀態交給代理，也能註冊它可呼叫的函式。代理看見目前的表格、選取的記錄或開啟中的表單，接著執行一步動作，例如排序欄位或開啟明細頁。狀態變化會回到應用程式，代理做過的事因此看得見也能復原，不會消失在對話紀錄裡。
人工核准
任何涉及金流、權限或客戶資料的動作，都能要求執行前先確認。請求會帶著填好的參數出現在對話中，使用者當場核准或拒絕。在受監管、直接面對客戶的業務裡，未經審閱的代理動作難以交代，這項機制往往是導入與否的分界。
AG-UI 協定與代理後端
AG-UI 是開放的的事件驅動協定，把代理後端與前端的溝通方式標準化。CopilotKit 維護這套協定，並提供 LangGraph、CrewAI、Mastra、Google ADK、AWS Strands、OpenAI Agents SDK 與 Claude Agent SDK 的連接，另有二十多種可用。協定與 SDK 分開，日後更換代理框架時，前端程式碼仍能保留。
自行架設與 CopilotKit Intelligence
前端 SDK 採 MIT 授權，執行環境可以放在自家基礎設施，包含地端或 VPC 內。託管版本 CopilotKit Intelligence 加上對話串儲存、主機服務、Slack 與 Teams 頻道、除錯用的檢視器以及分析功能。付費方案會拉高保留期限與儲存上限。
優缺點
優點
- 開源 SDK 接下串流、工具呼叫與情境串接這些重複工作。
- AG-UI 讓前端與代理框架脫鉤，日後更換的成本因此降低。
- 現成元件涵蓋側邊欄、彈出視窗與無介面版本，能沿用自家設計系統。
- 人工核准讓代理動作可稽核，對客服與財務流程特別要緊。
- 免費託管方案提供 200 條對話串與一個 Slack 或 Teams 組織，足以做初期原型。
缺點
- 這是給開發者用的工具，沒有前端底子的行銷團隊或單人創業者無法直接上手。
- 免費方案只保留對話串三天，儲存上限 1 GB，要拿真實使用者測試會很吃緊。
- 自動學習、分析與部分企業功能仍在搶先體驗，行為可能改變。
- 文件與 API 名稱在主要版本之間改過，舊教學在設定階段容易誤導。
常見問題
它幫你在已經在開發的應用程式裡加入 AI 助理：對話面板、頁面上的代理動作，以及圖表或表單這類生成的介面元素。開發者用它讓代理直接操作真實的應用程式狀態，而不是在另一個視窗裡回答。
相關內容
探索與 CopilotKit 相關的工具、技能與文章。
CopilotKit 替代方案
Base Code
Base44 (Wix) · 程式設計 · 生產力Base Code 是 Base44 推出的共享雲端開發環境。團隊在對話中描述對既有 GitHub 儲存庫的修改，看著預覽確認結果，再以 Pull Request 交回工程團隊。
Google EmbeddingGemma 2
Google DeepMind · 寫作 · 圖片 · 程式設計Google EmbeddingGemma 2 是 7.4 億參數的開源模型，能把文字、程式碼、圖片、音訊與影片畫面轉成同一個 768 維空間裡的向量，在手機與筆電上就能執行。
GitGlow
GitGlow · 程式設計 · 生產力GitGlow 是桌面版 Git 用戶端，把你自己的程式碼與 AI 代理程式的變更集中在同一份審查裡，讓你在交付前看清楚機器上究竟要送出什麼。