OpenHands/OpenHands

OpenHands – Agent Canvas

是什麼 – 一個自架設的 Web UI，讓開發者能在任何後端（本地、Docker、VM 或 OpenHands 雲）上執行、切換並協調 AI 程式碼代理（例如 OpenHands、Claude Code、Codex、Gemini 等）。

核心功能

• 後端無關：透過 Agent-Client Protocol (ACP) 連接到多個 Agent Server 實例，並在不離開 UI 的情況下自由切換。
• 自動化引擎：定義排程工作或 Webhook 觸發的工作流程，呼叫代理，並內建支援 Slack、GitHub、Linear、Notion 等整合。
• 自帶模型：透過可設定的 LLM 設定檔接入任何 LLM；UI 不會將你鎖定在特定供應商。
• 自架設：可透過單一 npm 套件、Docker 容器或原始碼安裝；除非選擇 OpenHands Cloud/Enterprise，否則整個堆疊完全在你的基礎設施上運作。
• 開發者控制中心：從單一瀏覽器頁面啟動對話、檢視代理日誌，並管理專案（透過主機目錄掛載）。

典型工作流程

1. 安裝 @openhands/agent-canvas npm 套件（或拉取 Docker 鏡像）。
2. 啟動 UI（agent-canvas 命令）：啟動本地前端、Agent Server 和 Automation Server。
3. 新增後端 – 例如基於 Docker 的 OpenHands 伺服器、遠端 Claude Code 端點或自訂 ACP 相容代理。
4. 建立自動化：例如，當有新的 GitHub 問題時，執行代理將問題分解為子任務，並將摘要發布至 Slack。
5. 在 Web UI 中監控對話與結果。

安裝捷徑

• npm（無沙箱）：npm install -g @openhands/agent-canvas && agent-canvas
• Docker 沙箱：docker run -it --rm -p 8000:8000 -v $HOME/.openhands:/home/openhands/.openhands -v $HOME/projects:/projects ghcr.io/openhands/agent-canvas:1.24.0
• 從原始碼：克隆倉儲，執行 npm install && npm run dev。

架構概覽

• Agent Canvas（本倉儲） – React/TypeScript 前端 + 編排邏輯。
• OpenHands Agent Server（位於 software-agent-sdk 中） – 執行一個或多個代理，並公開對話、工具與工作區端點的 REST API。
• Automation Server（OpenHands/automation） – 排程器/Webhook 分發器，用於觸發 Agent Server。
• TypeScript 客戶端（OpenHands/typescript-client） – Canvas UI 用來與 Agent Server 通訊的程式庫。

適用對象

• 希望在機器上擁有始終在線的 AI 配對程式員的個人開發者。
• 不願將程式碼傳送給第三方 SaaS，但需要共享「AI 工程助理」的小型團隊。
• 希望將 LLM 驅動的程式碼操作（審查、相依性更新、問題分類）整合至既有 CI/CD 或 chatops 流水線的組織。

文件與社群

• 快速入門指南、自架設文件與詳細架構文件位於 docs/ 資料夾中。
• 支援用的公開 Slack 頻道（#proj-agent-canvas）。
• CI 標籤顯示自動化測試狀態；專案處於測試階段。

授權 – 開源（倉儲本身採 MIT 授權；詳情請參閱 LICENSE 檔案）。