name: agent-browser description: 使用Vercel的agent-browser CLI进行浏览器自动化。当您需要与网页交互、填写表单、截图或抓取数据时使用。替代Playwright MCP - 使用Bash命令和基于引用的元素选择。触发词包括"浏览网站"、“填写表单”、“点击按钮”、“截图”、“抓取页面”、“网页自动化”。
agent-browser: CLI浏览器自动化
Vercel的无头浏览器自动化CLI，专为AI代理设计。使用来自可访问性快照的基于引用的选择（@e1, @e2）。
设置检查
# 检查安装
command -v agent-browser >/dev/null 2>&1 && echo "已安装" || echo "未安装 - 运行: npm install -g agent-browser && agent-browser install"
如果需要则安装
npm install -g agent-browser
agent-browser install # 下载Chromium
核心工作流程
快照 + 引用模式对LLMs最优:
- 导航到URL
- 快照获取带有引用的交互元素
- 交互使用引用（@e1, @e2等）
- 重新快照在导航或DOM更改后
# 步骤1: 打开URL
agent-browser open https://example.com
# 步骤2: 获取带有引用的交互元素
agent-browser snapshot -i --json
# 步骤3: 使用引用交互
agent-browser click @e1
agent-browser fill @e2 "搜索查询"
# 步骤4: 更改后重新快照
agent-browser snapshot -i
关键命令
导航
agent-browser open <url> # 导航到URL
agent-browser back # 后退
agent-browser forward # 前进
agent-browser reload # 重新加载页面
agent-browser close # 关闭浏览器
快照（对AI至关重要）
agent-browser snapshot # 完整可访问性树
agent-browser snapshot -i # 仅交互元素（推荐）
agent-browser snapshot -i --json # JSON输出用于解析
agent-browser snapshot -c # 紧凑（移除空元素）
agent-browser snapshot -d 3 # 限制深度
交互
agent-browser click @e1 # 点击元素
agent-browser dblclick @e1 # 双击
agent-browser fill @e1 "文本" # 清空并填充输入
agent-browser type @e1 "文本" # 键入不清空
agent-browser press Enter # 按键
agent-browser hover @e1 # 悬停元素
agent-browser check @e1 # 勾选复选框
agent-browser uncheck @e1 # 取消勾选复选框
agent-browser select @e1 "选项" # 选择下拉选项
agent-browser scroll down 500 # 滚动（上/下/左/右）
agent-browser scrollintoview @e1 # 滚动元素到视图
获取信息
agent-browser get text @e1 # 获取元素文本
agent-browser get html @e1 # 获取元素HTML
agent-browser get value @e1 # 获取输入值
agent-browser get attr href @e1 # 获取属性
agent-browser get title # 获取页面标题
agent-browser get url # 获取当前URL
agent-browser get count "button" # 计数匹配元素
截图和PDF
agent-browser screenshot # 视口截图
agent-browser screenshot --full # 完整页面
agent-browser screenshot output.png # 保存到文件
agent-browser screenshot --full output.png # 完整页面保存到文件
agent-browser pdf output.pdf # 保存为PDF
等待
agent-browser wait @e1 # 等待元素
agent-browser wait 2000 # 等待毫秒
agent-browser wait "文本" # 等待文本出现
语义定位器（引用的替代）
agent-browser find role button click --name "提交"
agent-browser find text "注册" click
agent-browser find label "邮箱" fill "user@example.com"
agent-browser find placeholder "搜索..." fill "查询"
会话（并行浏览器）
# 运行多个独立浏览器会话
agent-browser --session browser1 open https://site1.com
agent-browser --session browser2 open https://site2.com
# 列出活动会话
agent-browser session list
示例
登录流程
agent-browser open https://app.example.com/login
agent-browser snapshot -i
# 输出显示: textbox "邮箱" [ref=e1], textbox "密码" [ref=e2], button "登录" [ref=e3]
agent-browser fill @e1 "user@example.com"
agent-browser fill @e2 "password123"
agent-browser click @e3
agent-browser wait 2000
agent-browser snapshot -i # 验证已登录
搜索和提取
agent-browser open https://news.ycombinator.com
agent-browser snapshot -i --json
# 解析JSON找到故事链接
agent-browser get text @e12 # 获取标题文本
agent-browser click @e12 # 点击打开故事
表单填写
agent-browser open https://forms.example.com
agent-browser snapshot -i
agent-browser fill @e1 "张三"
agent-browser fill @e2 "zhang@example.com"
agent-browser select @e3 "美国"
agent-browser check @e4 # 同意条款
agent-browser click @e5 # 提交按钮
agent-browser screenshot confirmation.png
调试模式
# 运行带有可见浏览器窗口
agent-browser --headed open https://example.com
agent-browser --headed snapshot -i
agent-browser --headed click @e1
JSON输出
添加--json获取结构化输出:
agent-browser snapshot -i --json
返回:
{
"success": true,
"data": {
"refs": {
"e1": {"name": "提交", "role": "button"},
"e2": {"name": "邮箱", "role": "textbox"}
},
"snapshot": "- button \"提交\" [ref=e1]
- textbox \"邮箱\" [ref=e2]"
}
}
对比 Playwright MCP
| 功能 | agent-browser (CLI) | Playwright MCP |
|---|---|---|
| 接口 | Bash命令 | MCP工具 |
| 选择 | 引用（@e1） | 引用（e1） |
| 输出 | 文本/JSON | 工具响应 |
| 并行 | 会话 | 标签页 |
| 最适合 | 快速自动化 | 工具集成 |
使用 agent-browser 当:
- 您偏好基于Bash的工作流程
- 您想要更简单的CLI命令
- 您需要快速的一次性自动化
使用 Playwright MCP 当:
- 您需要深度MCP工具集成
- 您想要基于工具的响应
- 您正在构建复杂自动化