如何 5 分钟上手 AI-Employe从 Firebase 配置到本地跑通的首个 AI 浏览器自动化教程【免费下载链接】AI-EmployeCreate browser automation as if you were teaching a human using GPT-4 Vision.项目地址: https://gitcode.com/gh_mirrors/ai/AI-Employe本教程带你 5 分钟上手AI-Employe—— 一个开源的AI 浏览器自动化项目。它使用GPT-4 Vision驱动让你像教一个新员工一样用自然语言录制并复现网页操作AI 会自动点击、输入、完成任务无需编写任何爬虫代码。跟着本文完成 Firebase 配置、环境变量设置与服务启动你即可在本地浏览器中跑通自己的第一个 AI 自动化工作流。上手前准备一张清单搞定环境AI-Employe 的技术栈为Next.js Rust Postgres MeiliSearch Firebase Auth开始前请确认以下依赖已就绪 ✅依赖项用途说明Node.js npm运行 Web 前端与扩展构建建议 18 版本Rust Cargo运行 AI 调度后端服务监听 8080 端口Docker本地启动 Postgres 与 MeiliSearch两个服务都支持容器化运行Firebase 账号用户登录认证免费即可使用OpenAI API Key驱动 GPT-4 Vision 理解页面首次使用扩展时填入第 1 步克隆仓库并认识目录结构在项目根目录执行克隆命令git clone https://gitcode.com/gh_mirrors/ai/AI-Employe整个项目分为三大模块理解它们的职责能帮你快速定位问题client/web/Next.js 构建的 Web 控制台包含登录、工作流管理、数据看板数据库模型定义在 prisma/schema.prismaclient/extension/Chrome 浏览器扩展负责录制你的操作、截图发给 GPT-4 Vision 并执行 AI 指令server/Rust 编写的 AI 后端负责调度 GPT-4、索引 DOM 结构入口见 src/main.rs第 2 步5 分钟完成 Firebase 配置Firebase 只负责用户认证配置只需 3 步注册 Firebase 账号创建一个新的 Firebase 项目进入Project settings → Service accounts点击Generate new private key将下载的密钥保存为firebaseAdmin/cert/dev.json生产环境则为prod.json仓库中已提供firebaseAdmin/cert_sample/目录作为格式参考配置入口代码位于 firebaseAdmin/index.ts应用启动时会自动读取该私钥完成服务端认证。第 3 步填写环境变量与安装依赖仓库根目录提供了 .env.sample 模板复制并填写cp .env.sample .env.development新手只需重点关注这几个变量其余可留空OPEN_AI_API_KEY你的 OpenAI 密钥AI 能力的核心DATABASE_URLPostgres 连接串如postgresql://postgres:postgreslocalhost:5432/aiemplye_devMEILISEARCH_URL/MEILISEARCH_API_KEYMeiliSearch 地址默认http://127.0.0.1:7700NEXT_PUBLIC_*开头的 6 个变量来自 Firebase 控制台的 Web 应用配置前端认证依赖它们填好后在根目录执行npm install该命令会同时安装 web、extension、server 三个模块的依赖。第 4 步初始化数据库并一键启动全部服务确保 Docker 中的 Postgres 与 MeiliSearch 已启动然后依次执行npm run db:deploy # 执行 Prisma 数据库迁移 npm run dev # 同时启动 Web、扩展构建与 Rust 后端npm run dev会借助 concurrently 并行拉起三个进程启动成功后Web 控制台http://localhost:3000Rust AI 后端http://localhost:8080浏览器扩展已自动构建到client/extension/build目录第 5 步加载扩展创建你的首个 AI 工作流 打开 Chrome访问chrome://extensions开启右上角开发者模式点击加载已解压的扩展程序选择client/extension/build文件夹首次打开扩展进入 Setup 页面填入你的 OpenAI Key。放心密钥只保存在你本地电脑上不会上传到任何服务器该逻辑见 setup.tsx创建一个工作流填写标题与目标然后在真实网页上手动操作一遍点击、输入等。AI-Employe 会记录每一步的 DOM 变化而不是录屏保存后点击执行——GPT-4 Vision 读取页面截图并生成指令后端通过 MeiliSearch 定位真实元素AI 员工便开始替你重复劳动其元素定位的核心实现在 server/src/common/dom/search.rs这也是它比同类工具更可靠的关键。常见问题速查问题解决方法启动报数据库连接失败检查 Docker 中 Postgres 是否运行、DATABASE_URL是否填对扩展点击后无反应确认 Rust 后端 8080 端口已启动且.env中BACKEND_URL一致登录页卡住核对.env.development中NEXT_PUBLIC_*是否与 Firebase 项目一致AI 执行时迷路完善工作流标题和目标录制操作尽量贴近真实使用路径写在最后至此你已经从零跑通了AI-Employe一个把教人做事变成教 AI 做网页的AI 浏览器自动化工具。它的 Roadmap 中还有工作流循环、语音控制浏览器、社区共享工作流等能力建议持续关注项目更新。动手创建你的第一个工作流让 AI 员工开始替你打工吧 【免费下载链接】AI-EmployeCreate browser automation as if you were teaching a human using GPT-4 Vision.项目地址: https://gitcode.com/gh_mirrors/ai/AI-Employe创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考