关于 agent-browser
面向 Agent 的浏览器自动化命令行工具使用技能,提供从导航、页面快照到交互和验证的操作流程。内容还涵盖身份验证状态、并行会话、数据提取及可选安全限制。
主要功能
- 01导航、快照与页面交互
- 02保存身份验证和会话状态
- 03并行管理多个浏览器会话
- 04提取页面文本与 JSON
- 05按需限制域名和操作
适用场景
- 01自动填写并提交网页表单
- 02复用登录状态执行浏览器任务
- 03从网页提取文本或结构化数据
- 04比较页面变化并验证操作结果
安装
复制下面的命令,在终端中运行。
npx skills add https:/ / github.com/ exceptionless/ exceptionless --skill agent-browser安装后在 Claude Code 中输入/agent-browser确认已加载。
包含的文件
除 SKILL.md 外,安装时一起下载的参考资料和脚本。
references/authentication.mdcommands.mdprofiling.mdproxy-support.mdsession-management.mdsnapshot-refs.mdvideo-recording.mdtemplates/authenticated-session.shcapture-workflow.shform-automation.sh详细介绍
使用 agent-browser 进行浏览器自动化
核心工作流
每次浏览器自动化都遵循以下模式:
- 导航:
agent-browser open <url> - 快照:
agent-browser snapshot -i(获取@e1、@e2等元素引用) - 交互:使用引用进行点击、填写和选择
- 重新拍摄快照:导航或 DOM 发生变化后,获取新的引用
agent-browser open https://example.com/form
agent-browser snapshot -i
# Output: @e1 [input type="email"], @e2 [input type="password"], @e3 [button] "Submit"
agent-browser fill @e1 "[email protected]"
agent-browser fill @e2 "password123"
agent-browser click @e3
agent-browser wait --load networkidle
agent-browser snapshot -i # Check result
命令串联
可以在单次 shell 调用中使用 && 串联命令。浏览器会通过后台守护进程在多个命令间保持运行,因此串联既安全又比单独调用更高效。
# Chain open + wait + snapshot in one call
agent-browser open https://example.com && agent-browser wait --load networkidle && agent-browser snapshot -i
# Chain multiple interactions
agent-browser fill @e1 "[email protected]" && agent-browser fill @e2 "password123" && agent-browser click @e3
# Navigate and capture
agent-browser open https://example.com && agent-browser wait --load networkidle && agent-browser screenshot page.png
**何时串联:**如果无需读取中间命令的输出即可继续(例如,打开页面 + 等待 + 截图),请使用 &&。如果需要先解析输出(例如,先通过快照找到引用,再使用这些引用进行交互),则应分开运行命令。
常用命令
# Navigation
agent-browser open <url> # Navigate (aliases: goto, navigate)
agent-browser close # Close browser
# Snapshot
agent-browser snapshot -i # Interactive elements with refs (recommended)
agent-browser snapshot -i -C # Include cursor-interactive elements (divs with onclick, cursor:pointer)
agent-browser snapshot -s "#selector" # Scope to CSS selector
# Interaction (use @refs from snapshot)
agent-browser click @e1 # Click element
agent-browser click @e1 --new-tab # Click and open in new tab
agent-browser fill @e2 "text" # Clear and type text
agent-browser type @e2 "text" # Type without clearing
agent-browser select @e1 "option" # Select dropdown option
agent-browser check @e1 # Check checkbox
agent-browser press Enter # Press key
agent-browser keyboard type "text" # Type at current focus (no selector)
agent-browser keyboard inserttext "text" # Insert without key events
agent-browser scroll down 500 # Scroll page
agent-browser scroll down 500 --selector "div.content" # Scroll within a specific container
# Get information
agent-browser get text @e1 # Get element text
agent-browser get url # Get current URL
agent-browser get title # Get page title
# Wait
agent-browser wait @e1 # Wait for element
agent-browser wait --load networkidle # Wait for network idle
agent-browser wait --url "**/page" # Wait for URL pattern
agent-browser wait 2000 # Wait milliseconds
# Downloads
agent-browser download @e1 ./file.pdf # Click element to trigger download
agent-browser wait --download ./output.zip # Wait for any download to complete
agent-browser --download-path ./downloads open <url> # Set default download directory
# Capture
agent-browser screenshot # Screenshot to temp dir
agent-browser screenshot --full # Full page screenshot
agent-browser screenshot --annotate # Annotated screenshot with numbered element labels
agent-browser pdf output.pdf # Save as PDF
# Diff (compare page states)
agent-browser diff snapshot # Compare current vs last snapshot
agent-browser diff snapshot --baseline before.txt # Compare current vs saved file
agent-browser diff screenshot --baseline before.png # Visual pixel diff
agent-browser diff url <url1> <url2> # Compare two pages
agent-browser diff url <url1> <url2> --wait-until networkidle # Custom wait strategy
agent-browser diff url <url1> <url2> --selector "#main" # Scope to element
常见模式
提交表单
agent-browser open https://example.com/signup
agent-browser snapshot -i
agent-browser fill @e1 "Jane Doe"
agent-browser fill @e2 "[email protected]"
agent-browser select @e3 "California"
agent-browser check @e4
agent-browser click @e5
agent-browser wait --load networkidle
使用 Auth Vault 进行身份验证(推荐)
# Save credentials once (encrypted with AGENT_BROWSER_ENCRYPTION_KEY)
# Recommended: pipe password via stdin to avoid shell history exposure
echo "pass" | agent-browser auth save github --url https://github.com/login --username user --password-stdin
# Login using saved profile (LLM never sees password)
agent-browser auth login github
# List/show/delete profiles
agent-browser auth list
agent-browser auth show github
agent-browser auth delete github
使用状态持久化进行身份验证
# Login once and save state
agent-browser open https://app.example.com/login
agent-browser snapshot -i
agent-browser fill @e1 "$USERNAME"
agent-browser fill @e2 "$PASSWORD"
agent-browser click @e3
agent-browser wait --url "**/dashboard"
agent-browser state save auth.json
# Reuse in future sessions
agent-browser state load auth.json
agent-browser open https://app.example.com/dashboard
会话持久化
# Auto-save/restore cookies and localStorage across browser restarts
agent-browser --session-name myapp open https://app.example.com/login
# ... login flow ...
agent-browser close # State auto-saved to ~/.agent-browser/sessions/
# Next time, state is auto-loaded
agent-browser --session-name myapp open https://app.example.com/dashboard
# Encrypt state at rest
export AGENT_BROWSER_ENCRYPTION_KEY=$(openssl rand -hex 32)
agent-browser --session-name secure open https://app.example.com
# Manage saved states
agent-browser state list
agent-browser state show myapp-default.json
agent-browser state clear myapp
agent-browser state clean --older-than 7
数据提取
agent-browser open https://example.com/products
agent-browser snapshot -i
agent-browser get text @e5 # Get specific element text
agent-browser get text body > page.txt # Get all page text
# JSON output for parsing
agent-browser snapshot -i --json
agent-browser get text @e1 --json
并行会话
agent-browser --session site1 open https://site-a.com
agent-browser --session site2 open https://site-b.com
agent-browser --session site1 snapshot -i
agent-browser --session site2 snapshot -i
agent-browser session list
连接到现有 Chrome
# Auto-discover running Chrome with remote debugging enabled
agent-browser --auto-connect open https://example.com
agent-browser --auto-connect snapshot
# Or with explicit CDP port
agent-browser --cdp 9222 snapshot
配色方案(深色模式)
# Persistent dark mode via flag (applies to all pages and new tabs)
agent-browser --color-scheme dark open https://example.com
# Or via environment variable
AGENT_BROWSER_COLOR_SCHEME=dark agent-browser open https://example.com
# Or set during session (persists for subsequent commands)
agent-browser set media dark
可视化浏览器(调试)
agent-browser --headed open https://example.com
agent-browser highlight @e1 # Highlight element
agent-browser record start demo.webm # Record session
agent-browser profiler start # Start Chrome DevTools profiling
agent-browser profiler stop trace.json # Stop and save profile (path optional)
使用 AGENT_BROWSER_HEADED=1 环境变量启用有头模式。浏览器扩展在有头和无头模式下均可使用。
本地文件(PDF、HTML)
# Open local files with file:// URLs
agent-browser --allow-file-access open file:///path/to/document.pdf
agent-browser --allow-file-access open file:///path/to/page.html
agent-browser screenshot output.png
iOS 模拟器(移动版 Safari)
# List available iOS simulators
agent-browser device list
# Launch Safari on a specific device
agent-browser -p ios --device "iPhone 16 Pro" open https://example.com
# Same workflow as desktop - snapshot, interact, re-snapshot
agent-browser -p ios snapshot -i
agent-browser -p ios tap @e1 # Tap (alias for click)
agent-browser -p ios fill @e2 "text"
agent-browser -p ios swipe up # Mobile-specific gesture
# Take screenshot
agent-browser -p ios screenshot mobile.png
# Close session (shuts down simulator)
agent-browser -p ios close
**要求:**macOS、Xcode 和 Appium(npm install -g appium && appium driver install xcuitest)
**真实设备:**如果已预先配置,也可以使用实体 iOS 设备。使用 --device "<UDID>",其中 UDID 来自 xcrun xctrace list devices。
安全性
所有安全功能均为可选。默认情况下,agent-browser 不会对导航、操作或输出施加任何限制。
内容边界(推荐用于 AI Agent)
启用 --content-boundaries,即可用标记包裹页面来源的输出,帮助大模型区分工具输出和不可信的页面内容:
export AGENT_BROWSER_CONTENT_BOUNDARIES=1
agent-browser snapshot
# Output:
# --- AGENT_BROWSER_PAGE_CONTENT nonce=<hex> origin=https://example.com ---
# [accessibility tree]
# --- END_AGENT_BROWSER_PAGE_CONTENT nonce=<hex> ---
域名允许列表
将导航限制在可信域名内。*.example.com 之类的通配符也会匹配裸域名 example.com。发往未允许域名的子资源请求、WebSocket 和 EventSource 连接也会被阻止。请加入目标页面所依赖的 CDN 域名:
export AGENT_BROWSER_ALLOWED_DOMAINS="example.com,*.example.com"
agent-browser open https://example.com # OK
agent-browser open https://malicious.com # Blocked
操作策略
使用策略文件限制破坏性操作:
export AGENT_BROWSER_ACTION_POLICY=./policy.json
policy.json 示例:
{"default": "deny", "allow": ["navigate", "snapshot", "click", "scroll", "wait", "get"]}
Auth Vault 操作(如 auth login)不受操作策略限制,但仍受域名允许列表约束。
输出限制
防止大型页面导致上下文过载:
export AGENT_BROWSER_MAX_OUTPUT=50000
差异对比(验证更改)
执行操作后,使用 diff snapshot 验证操作是否达到预期效果。此命令会将当前无障碍树与会话中上一次拍摄的快照进行比较。
# Typical workflow: snapshot -> action -> diff
agent-browser snapshot -i # Take baseline snapshot
agent-browser click @e2 # Perform action
agent-browser diff snapshot # See what changed (auto-compares to last snapshot)
如需进行视觉回归测试或监控:
# Save a baseline screenshot, then compare later
agent-browser screenshot baseline.png
# ... time passes or changes are made ...
agent-browser diff screenshot --baseline baseline.png
# Compare staging vs production
agent-browser diff url https://staging.example.com https://prod.example.com --screenshot
diff snapshot 的输出使用 + 表示新增项,使用 - 表示移除项,与 git diff 类似。diff screenshot 会生成差异图像,以红色突出显示变化的像素,并给出不匹配百分比。
超时与加载缓慢的页面
本地浏览器的默认 Playwright 超时时间为 25 秒。可以通过 AGENT_BROWSER_DEFAULT_TIMEOUT 环境变量(值以毫秒为单位)进行调整。对于加载缓慢的网站或大型页面,请使用显式等待,而不要依赖默认超时:
# Wait for network activity to settle (best for slow pages)
agent-browser wait --load networkidle
# Wait for a specific element to appear
agent-browser wait "#content"
agent-browser wait @e1
# Wait for a specific URL pattern (useful after redirects)
agent-browser wait --url "**/dashboard"
# Wait for a JavaScript condition
agent-browser wait --fn "document.readyState === 'complete'"
# Wait a fixed duration (milliseconds) as a last resort
agent-browser wait 5000
如果网站经常加载缓慢,请在 open 后使用 wait --load networkidle,确保页面完全加载后再拍摄快照。如果某个特定元素渲染缓慢,可使用 wait <selector> 或 wait @ref 直接等待该元素。
会话管理与清理
同时运行多个 Agent 或自动化任务时,务必使用命名会话以避免冲突:
# Each agent gets its own isolated session
agent-browser --session agent1 open site-a.com
agent-browser --session agent2 open site-b.com
# Check active sessions
agent-browser session list
完成后务必关闭浏览器会话,以免进程泄漏:
agent-browser close # Close default session
agent-browser --session agent1 close # Close specific session
如果之前的会话未能正确关闭,守护进程可能仍在运行。开始新任务前,请使用 agent-browser close 将其清理。
Ref 生命周期(重要)
页面发生变化时,Ref(@e1、@e2 等)会失效。在以下情况后务必重新生成快照:
- 点击会跳转的链接或按钮
- 提交表单
- 动态内容加载(下拉菜单、模态框)
agent-browser click @e5 # Navigates to new page
agent-browser snapshot -i # MUST re-snapshot
agent-browser click @e1 # Use new refs
带注释的屏幕截图(视觉模式)
使用 --annotate 截取屏幕截图,并在交互元素上覆盖编号标签。每个标签 [N] 对应 Ref @eN。此操作还会缓存 Ref,因此无需单独生成快照即可立即与元素交互。
agent-browser screenshot --annotate
# Output includes the image path and a legend:
# [1] @e1 button "Submit"
# [2] @e2 link "Home"
# [3] @e3 textbox "Email"
agent-browser click @e2 # Click using ref from annotated screenshot
在以下情况下使用带注释的屏幕截图:
- 页面上有未标注的图标按钮或仅以视觉形式呈现的元素
- 需要检查视觉布局或样式
- 页面上有 Canvas 或图表元素(文本快照无法显示)
- 需要根据元素位置进行空间推理
语义定位器(Ref 的替代方案)
当 Ref 不可用或不可靠时,请使用语义定位器:
agent-browser find text "Sign In" click
agent-browser find label "Email" fill "[email protected]"
agent-browser find role button click --name "Submit"
agent-browser find placeholder "Search" type "query"
agent-browser find testid "submit-btn" click
JavaScript 求值(eval)
使用 eval 在浏览器上下文中运行 JavaScript。Shell 引号可能会破坏复杂表达式——使用 --stdin 或 -b 避免问题。
# Simple expressions work with regular quoting
agent-browser eval 'document.title'
agent-browser eval 'document.querySelectorAll("img").length'
# Complex JS: use --stdin with heredoc (RECOMMENDED)
agent-browser eval --stdin <<'EVALEOF'
JSON.stringify(
Array.from(document.querySelectorAll("img"))
.filter(i => !i.alt)
.map(i => ({ src: i.src.split("/").pop(), width: i.width }))
)
EVALEOF
# Alternative: base64 encoding (avoids all shell escaping issues)
agent-browser eval -b "$(echo -n 'Array.from(document.querySelectorAll("a")).map(a => a.href)' | base64)"
**为何这很重要:**Shell 处理命令时,内部双引号、! 字符(历史扩展)、反引号和 $() 都可能在 JavaScript 传递给 agent-browser 之前将其破坏。--stdin 和 -b 标志可完全绕过 Shell 解析。
实用规则:
- 单行且无嵌套引号 -> 使用单引号的常规
eval 'expression'即可 - 有嵌套引号、箭头函数、模板字面量或多行内容 -> 使用
eval --stdin <<'EVALEOF' - 程序化生成的脚本 -> 使用带 Base64 编码的
eval -b
配置文件
在项目根目录创建 agent-browser.json,以保存持久设置:
{
"headed": true,
"proxy": "http://localhost:8080",
"profile": "./browser-data"
}
优先级(从低到高):~/.agent-browser/config.json < ./agent-browser.json < 环境变量 < CLI 标志。使用 --config <path> 或 AGENT_BROWSER_CONFIG 环境变量指定自定义配置文件(文件缺失或无效时会报错退出)。所有 CLI 选项都会映射为驼峰命名的键(例如,--executable-path -> "executablePath")。布尔标志接受 true/false 值(例如,--headed false 会覆盖配置)。用户配置和项目配置中的扩展会合并,而非相互替换。
深入文档
| 参考文档 | 适用场景 |
|---|---|
| references/commands.md | 完整的命令参考及所有选项 |
| references/snapshot-refs.md | Ref 生命周期、失效规则与故障排查 |
| references/session-management.md | 并行会话、状态持久化与并发抓取 |
| references/authentication.md | 登录流程、OAuth、双重身份验证处理与状态复用 |
| references/video-recording.md | 用于调试和文档编写的录制工作流 |
| references/profiling.md | 用于性能分析的 Chrome DevTools 性能分析 |
| references/proxy-support.md | 代理配置、地理位置测试与轮换代理 |
实验性:原生模式
agent-browser 提供了一个实验性的原生 Rust 守护进程,可通过 CDP 直接与 Chrome 通信,完全绕过 Node.js 和 Playwright。该功能需选择启用,目前不建议用于生产环境。
# Enable via flag
agent-browser --native open example.com
# Enable via environment variable (avoids passing --native every time)
export AGENT_BROWSER_NATIVE=1
agent-browser open example.com
原生守护进程支持 Chromium 和 Safari(通过 WebDriver)。目前尚不支持 Firefox 和 WebKit。所有核心命令(navigate、snapshot、click、fill、screenshot、cookies、storage、tabs、eval 等)在原生模式下的工作方式都相同。在同一会话中切换原生模式和默认模式前,请先运行 agent-browser close。
开箱即用的模板
| 模板 | 说明 |
|---|---|
| templates/form-automation.sh | 填写表单并进行验证 |
| templates/authenticated-session.sh | 登录一次,重复使用状态 |
| templates/capture-workflow.sh | 提取内容并截取屏幕截图 |
./templates/form-automation.sh https://example.com/form
./templates/authenticated-session.sh https://app.example.com/login
./templates/capture-workflow.sh https://example.com ./output