由 OpenAI 提供支持的计算机使用 AI Agent：Surf

项目简介

一个 Next.js 应用程序，允许 AI 与虚拟桌面环境交互。该项目将 E2B 的桌面沙盒与 OpenAI 的 API 集成，创建一个可以通过自然语言指令在虚拟计算机上执行任务的 AI 代理。

E2B 是一个开源的云隔离虚拟计算机，专为 AI 用例设计。

计算机使用应用提供了一个网页界面，用户可以：

1. 启动虚拟桌面沙盒环境
2. 向 AI 代理发送自然语言指令
3. 观看 AI 代理在虚拟桌面上执行操作
4. 通过聊天界面与 AI 互动

应用程序使用服务器发送事件（SSE）实时流式传输 AI 响应和动作，提供无缝体验。

工作原理

架构

该应用程序由几个关键组件组成：

1. 前端 UI（Next.js）：提供具有虚拟桌面视图和聊天界面的用户界面
2. E2B 桌面沙盒：创建和管理虚拟桌面环境
3. OpenAI 计算机使用：处理用户指令并为 AI 代理生成动作
4. 流式 API：处理前端和后端之间的实时通信

核心流程
用户启动一个新的沙盒实例

1. E2B 创建虚拟桌面并提供流式 URL
2. 用户通过聊天界面发送指令
3. 后端使用 OpenAI 的 API 处理指令
4. 人工智能生成在虚拟桌面上执行的操作（点击、输入等）
5. 操作在沙盒中执行，并将结果流式传输回前端
6. 用户继续提供指令时，过程会重复

前置条件

开始之前，您需要：

1. Node.js（版本在 package.json 中指定）
2. npm（与 Node.js 一同提供）
3. E2B API 密钥
4. OpenAI API 密钥

设置说明

1. 克隆仓库

git clone https://github.com/e2b-dev/surf cd surf

1. 安装依赖

npm install

1. 设置环境变量

根据提供的 .env.example 在根目录下创建一个 .env.local 文件：

E2B_API_KEY=your_e2b_api_key OPENAI_API_KEY=your_openai_api_key

1. 启动开发服务器

npm run dev

1. 打开应用程序

在浏览器中导航到 http://localhost:3000

使用说明

启动沙盒实例

• 点击“启动新沙盒”按钮以初始化虚拟桌面环境
• 等待沙盒启动（这可能需要几秒钟）
  1. 发送指令
• 输入您的指令到聊天输入框中（例如：“打开 Firefox 并前往 google.com”）
• 按下回车键或点击发送按钮
• 如果有可用，您还可以选择示例提示
  2. 观看 AI 操作
• AI 将处理您的指令并在虚拟桌面上执行操作
• 您可以在聊天界面中看到 AI 的推理和行动
• 虚拟桌面将在执行操作时实时更新
  3. 管理沙盒
• 计时器显示您的沙盒实例剩余时间
• 您可以随时通过点击“停止”按钮来停止沙盒
• 沙盒即将到期时，将自动延长其时间

功能

• 虚拟桌面环境：在沙盒中运行基于 Linux 的桌面
• 人工智能交互：使用 OpenAI 的 API 理解并执行用户指令
• 实时流式传输：显示 AI 动作和响应的发生过程
• 聊天界面：提供与 AI 交互的对话式界面
• 示例提示：提供预定义的指令以帮助用户开始
• 暗色/亮色模式：支持暗色和亮色主题

技术细节

依赖项

应用程序使用多个关键依赖项：

• Next.js：React 前端框架
• @e2b/desktop：用于创建和管理桌面沙盒环境的 SDK
• OpenAI：用于与 OpenAI API 交互的 SDK
• Tailwind CSS：用于样式的实用型 CSS 框架
• Framer Motion：动画库

查看 package.json 获取完整的依赖列表。

API 端点

• /api/chat: 处理聊天消息，流式传输 AI 响应和动作

服务器操作

• 创建沙盒实例：创建一个新的沙盒实例
• 增加超时时间：扩展沙箱超时时间
• 停止沙箱操作：停止正在运行的沙箱实例

故障排除

• 沙箱无法启动：请检查您的 E2B API 密钥是否在 `.env.local` 中正确
• AI 无响应：请检查您的 OpenAI API 密钥是否有效且具有访问所需模型的权限
• 操作不工作：确保沙盒正在运行，并且 AI 有适当的指令

项目链接

https://github.com/e2b-dev/surf

扫码加入技术交流群，备注「开发语言-城市-昵称」

（文：GitHubStore）

由 OpenAI 提供支持的计算机使用 AI Agent：Surf最先出现在每时AI。