Vercel agent-browser 深度解析:AI 驱动浏览器自动化实践
在 AI Agent 和自动化测试领域,浏览器自动化工具一直扮演着重要角色。Vercel Labs 推出的 agent-browser 是一个专为 AI Agent 设计的浏览器自动化 CLI 工具,它结合了 Rust 的高性能和 Node.js 的灵活性,为开发者提供了全新的浏览器自动化解决方案。
项目特点
技术架构
- Rust 核心:主要功能由 Rust 实现,提供高性能的底层操作
- Node.js 封装:通过 TypeScript 提供友好的开发者接口
- 双模式支持:优先使用 Rust 实现,自动回退到 Node.js 版本
核心优势
- AI 友好设计:独特的
snapshot命令生成带引用标记的可访问性树 - 极简 CLI:命令设计直观,易于集成到自动化流程
- 跨平台:支持 Windows、macOS 和 Linux 系统
安装指南
推荐安装方式(npm)
这是最简单的安装方式,适合大多数用户。安装完成后会自动下载 Chromium 浏览器。
npm install -g agent-browser
agent-browser install # 下载 Chromium
源码编译安装
源码安装适合需要自定义修改或希望使用最新特性的开发者,需要预先安装 Rust 工具链。
git clone https://github.com/vercel-labs/agent-browser
cd agent-browser
pnpm install
pnpm build
pnpm build:native # 需要 Rust 环境
pnpm link --global # 全局安装 agent-browser
agent-browser install
核心功能解析
1. 元素定位与操作
agent-browser 提供了两种元素定位方式,实际使用中建议根据场景选择。
传统选择器方式:适合熟悉 DOM 结构的开发者。
agent-browser click "#submit"
agent-browser fill "#email" "[email protected]"
AI 友好的引用标记方式:这种方式特别适合 AI 场景,AI 可以记住元素引用而不需要理解复杂的 CSS 选择器。
agent-browser snapshot # 获取带引用标记的可访问性树
agent-browser click @e2 # 通过引用标记点击元素
2. 页面交互命令
基本交互、表单操作和键盘操作都支持得很全面。
# 基本交互
agent-browser open example.com
agent-browser hover
agent-browser drag
agent-browser fill
agent-browser
agent-browser check
agent-browser press
agent-browser keydown
agent-browser keyup

