Open Agent Builder

通过可视化无代码界面构建、测试并部署 AI Agent 工作流

文档 • 示例工作流

---

什么是 Open Agent Builder？

Open Agent Builder 是一个可视化工作流构建器，用于创建由 Firecrawl 驱动的 AI Agent 流水线。你可以通过拖拽界面设计复杂的 Agent 工作流，并以实时流式更新的方式执行它们。

适用于：

• 网页抓取与数据提取工作流
• 多步 AI Agent 流水线
• 自动化研究与内容生成
• 数据转换与分析
• 具备人工介入审核的 Web 自动化

注意： 该项目正处于活跃开发阶段。部分功能仍在完善中，我们欢迎贡献和提交 PR！

---

核心功能

可视化工作流构建器

• 拖拽式界面：用于构建 Agent 工作流
• 实时执行：支持流式更新反馈
• 8 种核心节点类型：开始 (Start)、Agent、MCP Tools、转换 (Transform)、If/Else、While 循环、人工审核 (User Approval)、结束 (End)
• 模板库：提供预构建的工作流
• MCP 协议支持：支持可扩展的工具集成

由 Firecrawl 驱动

• 原生 Firecrawl 集成：用于网页抓取与搜索

企业级功能

• LangGraph 执行引擎：提供可靠的状态管理
• Clerk 身份验证：安全的多用户访问控制
• Convex 数据库：实现持久化存储
• API 端点：支持程序化执行
• 人工介入 (Human-in-the-loop)：支持敏感操作的审核

---

技术栈

技术	用途
Firecrawl	Web 抓取 API，将网站转换为 LLM 可用的数据
Next.js 16 (canary)	使用 App Router 的 React 框架，用于前端与 API 路由
TypeScript	全栈类型安全开发
LangGraph	工作流编排引擎，具备状态管理、条件路由和人工介入支持
Convex	实时数据库，为工作流、执行过程和用户数据提供自动响应式支持
Clerk	身份验证与用户管理，支持 JWT 集成
Tailwind CSS	用于响应式 UI 的原子化 CSS 框架
React Flow	可视化工作流画布，支持拖拽节点
Anthropic	Claude AI 集成，原生支持 MCP (Claude Haiku 4.5 & Sonnet 4.5)
OpenAI	gpt-5 集成 (即将支持 MCP)
Groq	开源模型的快速推理 (即将支持 MCP)
E2B	沙箱代码执行环境，用于安全的转换节点
Vercel	部署平台，支持 Edge Functions

---

前置条件

在开始之前，你需要准备：

1. 本机安装 Node.js 18+
2. Firecrawl API Key (用于网页抓取) - 点此获取
3. Convex 账号 - 免费注册
4. Clerk 账号 - 免费注册

注意： 设置完成后，LLM API Key 可以直接通过 UI 的 “设置 → API Keys” 添加。对于 MCP 工具支持，目前默认推荐使用 Anthropic Claude (Haiku 4.5 或 Sonnet 4.5)。

---

安装与设置

1. 克隆仓库

git clone https://github.com/firecrawl/open-agent-builder.git
cd open-agent-builder
npm install

2. 设置 Convex (数据库)

Convex 负责处理所有工作流及执行数据的持久化。

# 全局安装 Convex CLI
npm install -g convex

# 初始化 Convex 项目
npx convex dev

此操作将：

• 在浏览器中打开以创建/关联 Convex 项目
• 在你的 .env.local 文件中生成 NEXT_PUBLIC_CONVEX_URL
• 启动 Convex 开发服务器

请保持 Convex 开发服务器在独立终端中运行。

3. 设置 Clerk (身份验证)

Clerk 提供安全的用户身份验证和管理。

1. 前往 clerk.com 并创建一个新应用
2. 在你的 Clerk 控制面板中：
   • 进入 API Keys
   • 复制你的密钥
3. 进入 JWT Templates → Convex：
   • 点击 “Apply”
   • 复制 issuer URL

在你的 .env.local 中添加：

# Clerk 身份验证
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_test_...
CLERK_SECRET_KEY=sk_test_...

# Clerk + Convex 集成
CLERK_JWT_ISSUER_DOMAIN=https://your-clerk-domain.clerk.accounts.dev

4. 配置 Convex 身份验证

编辑 convex/auth.config.ts 并更新域名：

// 编辑你的 auth.config.ts 文件
export default {
  providers: [
    {
      domain: "https://your-clerk-domain.clerk.accounts.dev",
      applicationID: "convex",
    },
  ],
};