Agent-Browser: 适合ai的浏览器自动化 CLI 工具(以OpenCode为例)

介绍

Agent-Browser是Vercel 专为AI Agent 设计的一个浏览器自动化 CLI 工具,能让 它们模拟人类操作浏览器(点击、滚动、截图和填表单等), 是对playwright作为封装和优化,默认是无头模式操作浏览器。

agent-browser 及关联 Skill vs playwright-skill 综合信息表

Skill(技能 / 工具) 来源(获取 / 运行方式) 核心功能 核心技术(底层实现)
agent-browser npm install -g agent-browser 通用浏览器自动化(CLI 版) Playwright + 自有 CLI 封装
dogfood agent-browser 内置子 skill QA 测试、探索性测试 基于 agent-browser 核心能力
electron agent-browser 内置子 skill Electron 桌面应用测试 无额外标注(默认基于 agent-browser)
slack agent-browser 内置子 skill Slack 聊天工具自动化 无额外标注(默认基于 agent-browser)
playwright-skill 本地 skill(自定义 / 内置) 浏览器自动化测试 原生 Playwright(无额外封装)

agent-browser vs playwright-skill 功能特性对比表

特性 agent-browser playwright-skill
接口 CLI 命令(如 agent-browser click @e1) Playwright 多语言 API(Python/JS/Java 代码调用,如 page.click('#btn'))
元素引用 快照生成 @e1, @e2 简化引用 CSS/XPath/ 文本选择器(如 //div[@id="e1"]),支持精准定位
会话管理 内置 --session 参数一键管理 自定义代码实现(通过 context 上下文对象手动管理)
状态保存 内置 state save/load 命令 手动调用 storage_state 方法序列化 / 反序列化状态
认证 auth save/login 命令,加密存储凭证 手动处理 Cookie/Token,需结合加密库 / 环境变量存储
iOS 模拟器 原生支持 无原生支持,需结合 BrowserStack/Appium 等工具
浏览器引擎 Chrome, Lightpanda Chrome、Firefox、Safari、Edge 等全主流引擎
Diff 测试 内置 diff 命令一键执行 原生支持 toHaveScreenshot() / toMatchSnapshot(),内置 pixelmatch 像素级比对

选择建议

  • 简单重复任务、QA 快速验证 → agent-browser(CLI 命令简洁,无需编写代码)
  • 复杂业务逻辑、自定义自动化流程 → playwright-skill(代码化控制,灵活性和扩展性更高)

安装与使用

执行npm install -g agent-browser安装(当然你可以让ai自动安装,只是耗一点token,下同)

创建符号链接,让OpenCode、OpenClaw和Codex都能发现 agent-browser,记得路径按自己的电脑实际情况改

bash 复制代码
# 1. Codex & Opencode 全局 skills 目录
ln -s /opt/homebrew/lib/node_modules/agent-browser/skills/agent-browser ~/.agents/skills/agent-browser
ln -s /opt/homebrew/lib/node_modules/agent-browser/skills/dogfood ~/.agents/skills/dogfood
ln -s /opt/homebrew/lib/node_modules/agent-browser/skills/slack ~/.agents/skills/slack
ln -s /opt/homebrew/lib/node_modules/agent-browser/skills/electron ~/.agents/skills/electron
# 2. Openclaw 项目目录
ln -s /opt/homebrew/lib/node_modules/agent-browser/skills/agent-browser ~/Desktop/work/openclaw/.agents/skills/agent-browser
ln -s /opt/homebrew/lib/node_modules/agent-browser/skills/dogfood ~/Desktop/work/openclaw/.agents/skills/dogfood
ln -s /opt/homebrew/lib/node_modules/agent-browser/skills/slack ~/Desktop/work/openclaw/.agents/skills/slack
ln -s /opt/homebrew/lib/node_modules/agent-browser/skills/electron ~/Desktop/work/openclaw/.agents/skills/electron

执行opencode,让ai调查亚马逊平台的热门电器产品,可以发现ai执行了cli命令agent-browser open https://www.amazon.com && agent-browser wait --load networkidle && agent-browser screenshot amazon-home.png,这三个命令的作用分别是打开亚马逊平台链接、仅当页面成功打开后,等待页面的网络请求基本停止(动态内容完全加载)和对亚马逊首页截图为amazon-home.png

接下来ai自行操作,完成搜索、爬取数据、处理超时、模拟滚动、点击和截图等

最终结果

由于浏览器常规截图并非整个页面,不妨以ai打开电子产品链接(可以在ai的思考和执行过程看到那个链接)https://www.amazon.com/gp/bestsellers/electronics/ref=zg_bs_electronics_sm找另外几个产品进行验证,可以发现基本符合事实,只是部分评价最多的产品(很可能是ai只对提取前10个数据或当时页面没加载到更多商品,因为亚马逊平台的页面是动态的,不会一次性加载完全部产品)

创作不易,禁止抄袭,转载请附上原文链接及标题

相关推荐
灵动的艺术15 分钟前
如一 Agent 架构解读(二十四):Agent 高效率低成本思考
人工智能·agent·如一
Xxtaoaooo1 小时前
双11避坑:我用 WorkBuddy + TextIn xParse 做了个「避坑对比台」,商品详情图丢进去,参数矛盾自动现形
人工智能·1024程序员节·textin·workbuddy·ai数据层基础设施
昵称画1 小时前
交接班记录电子化:三班之间的信息不漏
开发语言·数据库·人工智能·低代码·php
Navicat中国1 小时前
将 Navicat 的 AI 助手连接到本地 LLM
人工智能·chatgpt
“AI国潮设计-小江”2 小时前
【AIGC实战】Python+SDXL批量生成“潮汕英歌舞不倒翁”IP | 角色一致性与多场景融合方案,附完整代码
开发语言·人工智能·python·prompt·aigc
点PY2 小时前
WeDetect论文精读
人工智能
CCC:CarCrazeCurator2 小时前
稀疏奖励 vs 稠密奖励:强化学习中的反馈带宽权衡
人工智能·深度学习·机器人
骑着蜗牛撵大象3272 小时前
语音变分录、规则挡幻觉:拆解开源 AI 记账系统 Smart Ledger 的全栈设计
人工智能·ai·架构·js·数据校验
墨染天姬2 小时前
[AI]Cursor Subagent 机制详解
人工智能
数睿数据无代码开发2 小时前
企业AI落地从高价值场景开始|数睿数据《AI应用场景集》正式发布
人工智能