OpenClaw Skill 实战 | agent-browser:让 AI 帮你「上网干活」

你有没有过这样的经历——

每天花大量时间在网页上做重复性操作：填表单、抓数据、查价格、截图存档……这些事情，本质上就是「有手就行」的跑腿活儿。

而现在，有了 OpenClaw 的 agent-browser 技能，你可以让 AI 长出「眼睛」和「手」，像真人一样操控浏览器，7×24 小时帮你打工。

一、agent-browser 是什么？

agent-browser 是 OpenClaw 生态中下载量排名第二（159K+）的自动化技能，由开发者 Seth Rose 基于 Playwright 框架 + Rust 核心引擎打造。

🎯 一句话概括

它给你的 AI Agent 装上了一个「无头浏览器」，让 AI 能自主打开网页、点击按钮、填写表单、抓取数据、截图录屏——全程不需要你动手。

📊 核心数据

💪 能力全景

二、安装指南（3 种方式）

前提条件

• • 已安装 OpenClaw（claw --version 确认）
• • Node.js 18+（推荐使用 npm 安装方式）
• • macOS / Linux 系统

方式一：通过 ClawHub 安装（⭐ 推荐）

最简单，一条命令搞定：

claw install agent-browser

方式二：通过 npm 全局安装

# 全局安装npm install -g agent-browser# 安装浏览器依赖（Chromium 引擎）agent-browser install --with-deps

方式三：通过 Homebrew 安装（macOS）

brew install TheSethRose/tap/agent-browseragent-browser --version

验证安装

# 确认版本agent-browser --version# 快速测试：打开百度首页agent-browser open https://www.baidu.comagent-browser screenshot test.pngagent-browser close

如果 test.png 成功保存了百度首页的截图，恭喜你，安装成功！🎉

三、环境配置

安装完成后，可以通过环境变量或配置文件进行个性化配置。

环境变量配置

# 无头模式（不显示浏览器窗口，服务器推荐）export BROWSER_HEADLESS=true# 超时时间（毫秒）export BROWSER_TIMEOUT=30000# 自定义 User-Agent（反爬利器）export BROWSER_USER_AGENT="Mozilla/5.0 (Windows NT 10.0; Win64; x64) ..."# 代理服务器（翻墙 / 多 IP 轮换）export BROWSER_PROXY="http://127.0.0.1:7890"# 下载目录export BROWSER_DOWNLOAD_PATH="./downloads"

配置文件方式

编辑 ~/.openclaw/config.json：

{"skills":{"browser":{"enabled":true,"headless":true,"defaultTimeout":30000,"viewport":{"width":1920,"height":1080},"stealth":true,"randomDelay":true}}}

💡 小贴士：开启 stealth 和 randomDelay 可以模拟真人操作节奏，大幅降低被网站识别为机器人的概率。

四、Linux 服务器专题：无头环境完整部署指南 🐧

这是很多同学最关心的场景——服务器没有显示器、没有桌面环境，怎么让 agent-browser 跑起来？

Linux 服务器（如阿里云 ECS、腾讯云 CVM、AWS EC2 等）通常是无头环境（Headless），没有图形界面。agent-browser 天然支持无头模式，但需要一些额外配置才能顺利运行。

4.1 前置环境准备（Debian / Ubuntu）

# 1. 更新系统软件包sudo apt update && sudo apt upgrade -y# 2. 安装基础依赖（浏览器运行必需的系统库）sudo apt install -y \  wget curl unzip \  libx11-xcb1 libxcomposite1 libxcursor1 libxdamage1 \  libxi6 libxtst6 libnss3 libcups2 libxss1 \  libxrandr2 libasound2 libatk1.0-0 libatk-bridge2.0-0 \  libpangocairo-1.0-0 libgtk-3-0 libgbm1 \  ca-certificates fonts-liberation# 3. 安装中文字体（防止截图中文乱码，显示为方块）sudo apt install -y fonts-noto-cjk fonts-wqy-zenhei# 4. 安装 jq（JSON 解析工具，脚本中经常用到）sudo apt install -y jq

⚠️ CentOS / RHEL 用户：把 apt 换成 yum，字体包名为 google-noto-cjk-fonts。

4.2 安装 Google Chrome（推荐方案）

Linux 服务器上不要用 Snap 版 Chromium！Snap 的 AppArmor 沙箱限制会导致 OpenClaw 无法启动和监控浏览器进程，这是新手最常踩的坑。

推荐直接安装 Google Chrome 官方 .deb 包：

# 下载 Chromewget https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb# 安装（自动处理依赖）sudo apt install -y ./google-chrome-stable_current_amd64.deb# 如果出现依赖错误，修复一下sudo apt --fix-broken install -y# 验证安装google-chrome --version# 输出类似：Google Chrome 124.0.6367.91

4.3 配置 OpenClaw 关联浏览器

这是最关键的一步——告诉 OpenClaw 浏览器在哪里，并开启无头模式：

# 1. 设置默认浏览器配置文件openclaw config set browser.defaultProfile "openclaw"# 2. 开启无头模式（服务器没有显示器，必须开启！）openclaw config set browser.headless true# 3. 禁用沙箱模式（Linux 以 root 运行时必须开启，否则报错）openclaw config set browser.noSandbox true# 4. 指定 Chrome 可执行文件路径openclaw config set browser.executablePath "$(which google-chrome)"# 5. 重启 OpenClaw 网关使配置生效openclaw gateway restart# 6. 启动浏览器服务openclaw browser start

或者直接编辑配置文件 ~/.openclaw/openclaw.json：

{"browser":{"enabled":true,"defaultProfile":"openclaw","executablePath":"/usr/bin/google-chrome-stable","headless":true,"noSandbox":true,"cdpPort":18800}}

4.4 验证浏览器是否正常运行

# 方法一：通过 OpenClaw CLI 检查openclaw browser --browser-profile openclaw status# 期望输出：Browser running: true# 方法二：通过 API 检查curl -s http://127.0.0.1:18791/ | jq '{running, pid, chosenBrowser}'# 期望输出：# {#   "running": true,#   "pid": 12345,#   "chosenBrowser": "/usr/bin/google-chrome-stable"# }# 方法三：实际测试截图openclaw browser --browser-profile openclaw open https://www.baidu.comopenclaw browser --browser-profile openclaw screenshot test.pngls -la test.png  # 确认文件生成

4.5 使用 agent-browser Skill

OpenClaw 的浏览器底层配置好之后，agent-browser skill 就能直接使用了：

# 安装 skillclaw install agent-browser# 测试：打开网页并截图agent-browser open https://github.com/trendingagent-browser wait --load networkidleagent-browser screenshot --full trending.pngagent-browser close# 查看截图ls -la trending.png

4.6 Linux 服务器常见问题排查

4.7 进阶：用 systemd 管理浏览器服务

在生产服务器上，建议用 systemd 自动管理浏览器进程，防止意外退出：

# 创建 service 文件sudotee /etc/systemd/system/openclaw-browser.service << 'EOF'[Unit]Description=OpenClaw Browser ServiceAfter=network.target[Service]Type=simpleUser=your-usernameExecStart=/usr/bin/google-chrome-stable \  --headless \  --no-sandbox \  --disable-gpu \  --disable-dev-shm-usage \  --remote-debugging-port=18800 \  --user-data-dir=/home/your-username/.openclaw/browser/openclaw/user-data \  about:blankRestart=alwaysRestartSec=5[Install]WantedBy=multi-user.targetEOF# 启用并启动sudo systemctl daemon-reloadsudo systemctl enable openclaw-browsersudo systemctl start openclaw-browser# 检查状态sudo systemctl status openclaw-browser

💡 小贴士：--disable-dev-shm-usage 这个参数在内存较小的服务器上很重要，它让 Chrome 用 /tmp 而不是 /dev/shm（共享内存），避免因内存不足崩溃。

4.8 进阶：Docker 容器部署

如果你的 OpenClaw 跑在 Docker 里，Dockerfile 参考：

FROM ubuntu:22.04# 安装依赖RUN apt-get update && apt-get install -y \    wget curl gnupg unzip \    fonts-noto-cjk \    libx11-xcb1 libxcomposite1 libxcursor1 libxdamage1 \    libxi6 libxtst6 libnss3 libcups2 libxss1 \    libxrandr2 libasound2 libatk1.0-0 libatk-bridge2.0-0 \    libpangocairo-1.0-0 libgtk-3-0 libgbm1 \    && rm -rf /var/lib/apt/lists/*# 安装 ChromeRUN wget https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb \    && apt-get update \    && apt-get install -y ./google-chrome-stable_current_amd64.deb \    && rm google-chrome-stable_current_amd64.deb# 安装 Node.js + OpenClaw + agent-browserRUN curl -fsSL https://deb.nodesource.com/setup_20.x | bash - \    && apt-get install -y nodejs \    && npm install -g agent-browser# 配置 OpenClaw 浏览器ENV BROWSER_HEADLESS=trueENV BROWSER_TIMEOUT=60000

Docker Compose 配置：

version:'3.8'services:openclaw:build:.environment:-BROWSER_HEADLESS=true-BROWSER_TIMEOUT=60000# Chrome 需要 SYS_ADMIN 能力（或者用 --no-sandbox）cap_add:-SYS_ADMIN# 共享内存增大到 2G，防止 Chrome 崩溃shm_size:'2gb'volumes:-openclaw-data:/root/.openclawrestart:unless-stoppedvolumes:openclaw-data:

4.9 Linux 服务器性能优化建议

五、核心用法详解

agent-browser 的核心工作流遵循 4 步法则：

导航（Open） → 快照（Snapshot） → 交互（Interact） → 提取（Extract）

5.1 页面导航

# 打开网页agent-browser open https://example.com# 前进 / 后退 / 刷新agent-browser backagent-browser forwardagent-browser reload# 关闭浏览器agent-browser close

5.2 页面快照（关键步骤！）

快照是 agent-browser 的灵魂。它会扫描页面，给每个可交互元素分配一个引用 ID（如 @e1、@e2），后续的点击、输入操作都靠这个 ID 定位。

# 获取所有可交互元素（推荐）agent-browser snapshot -i# 输出示例：# @e1  [input]   搜索框  placeholder="请输入关键词"# @e2  [button]  搜索按钮  text="搜索"# @e3  [link]    登录     href="/login"# @e4  [select]  语言选择  options=["中文","English"]

# 获取完整页面结构（内容较多）agent-browser snapshot# 仅解析指定区域agent-browser snapshot -s "#main-content"# 限制解析深度agent-browser snapshot -d 3

⚠️ 重要：每次页面发生大幅变化（跳转、弹窗等），都必须重新执行 snapshot 获取最新的元素引用 ID！

4.3 元素交互

# 点击元素agent-browser click @e2# 清空并填写输入框agent-browser fill @e1 "OpenClaw 教程"# 追加输入（不清空原有内容）agent-browser type @e1 " 2026版"# 下拉框选择agent-browser select @e4 "中文"# 勾选 / 取消勾选agent-browser check @e5agent-browser uncheck @e5# 滚动页面agent-browser scroll down 500    # 向下滚动 500pxagent-browser scroll up 300      # 向上滚动 300px# 鼠标悬停agent-browser hover @e3# 拖拽agent-browser drag @e1 @e2

4.4 信息提取

# 获取元素文本agent-browser get text @e1# 获取元素 HTMLagent-browser get html @e1# 获取属性值agent-browser get attr @e1 href# 获取页面标题agent-browser get title# 统计元素数量agent-browser get count ".product-item"

4.5 截图与导出

# 截取当前视口agent-browser screenshot page.png# 截取整个页面（长截图）agent-browser screenshot --full fullpage.png# 导出为 PDFagent-browser pdf output.pdf# 录制视频agent-browser record start ./demo.webm# ... 执行一系列操作 ...agent-browser record stop

4.6 等待与状态检查

# 等待元素出现agent-browser wait @e1# 等待固定时间agent-browser wait 2000# 等待网络请求完成agent-browser wait --load networkidle# 等待 URL 变化agent-browser wait --url "/dashboard"# 检查元素是否可见agent-browser is visible @e1

5.7 会话管理（免登录神器）

# 保存当前登录状态agent-browser state save auth.json# 下次直接加载，跳过登录agent-browser state load auth.json# 使用独立会话（隔离不同任务）agent-browser open https://site-a.com --session taskAagent-browser open https://site-b.com --session taskB

六、实战案例

案例 1：电商竞品价格监控 🛒

场景：每隔 1 小时自动抓取竞品商品价格，发现降价立即通知。

#!/bin/bash# monitor-price.sh# 加载登录状态agent-browser state load taobao-auth.json# 打开商品页面agent-browser open "https://item.taobao.com/item.htm?id=xxxxx"# 等待价格元素加载agent-browser wait".tb-rmb-num"# 提取价格PRICE=$(agent-browser get text ".tb-rmb-num" --json | jq -r '.text')echo"当前价格：¥${PRICE}"# 截图存档agent-browser screenshot "price-$(date +%Y%m%d%H%M).png"# 价格低于阈值时发通知（搭配企业微信/钉钉机器人）if (( $(echo "$PRICE < 100" | bc -l) )); then  curl -X POST "https://qyapi.weixin.qq.com/cgi-bin/webhook/send?key=xxx" \    -H 'Content-Type: application/json' \    -d "{\"msgtype\":\"text\",\"text\":{\"content\":\"⚡ 竞品降价提醒：当前价格 ¥${PRICE}，低于 ¥100 阈值！\"}}"fiagent-browser close

搭配 cron 定时任务：

# 每小时执行一次0 * * * * /path/to/monitor-price.sh >> /var/log/price-monitor.log 2>&1

📈 效果：原来运营同事每天手动查价格要花 2 小时，现在全自动，降价第一时间收到通知。

案例 2：批量自动填表提交 📝

场景：HR 需要在招聘网站上批量发布 50 个岗位信息。

#!/bin/bash# batch-post-jobs.sh# 从 CSV 文件读取岗位数据while IFS=','read -r title salary location desc; doecho"正在发布：${title}"# 打开发布页面  agent-browser open "https://hr.example.com/post-job"  agent-browser snapshot -i# 填写表单  agent-browser fill @e1 "${title}"# 岗位名称  agent-browser fill @e2 "${salary}"# 薪资范围  agent-browser select @e3 "${location}"# 工作地点  agent-browser fill @e4 "${desc}"# 岗位描述# 点击发布  agent-browser click @e5# 等待发布成功  agent-browser wait --url "/post-success"  agent-browser screenshot "job-${title}.png"echo"✅ ${title} 发布成功"sleep 3  # 防止频率过高done < jobs.csvagent-browser closeecho"🎉 全部发布完成！"

⏱️ 效果：50 个岗位手动发布要 3-4 小时，脚本跑完只需 15 分钟。

案例 3：自动签到 + 状态保持 ✅

场景：每天早上 9 点自动签到某平台，赚取积分。

#!/bin/bash# daily-signin.sh# 加载登录状态（首次需手动登录并保存）agent-browser state load platform-auth.json# 打开签到页面agent-browser open "https://app.example.com/signin"agent-browser wait --load networkidleagent-browser snapshot -i# 查找并点击签到按钮agent-browser find text "签到" click# 等待签到结果agent-browser wait 2000agent-browser snapshot -i# 截图存档作为记录agent-browser screenshot "signin-$(date +%Y%m%d).png"# 更新登录状态（延长 Cookie 有效期）agent-browser state save platform-auth.jsonagent-browser closeecho"✅ $(date +%Y-%m-%d) 签到完成"

💡 首次使用需要手动登录一次并保存状态：

agent-browser open "https://app.example.com/login" --headed# 手动在浏览器中登录...agent-browser state save platform-auth.json

案例 4：网页数据批量抓取 📊

场景：从新闻网站批量抓取文章标题和链接，导出 CSV。

#!/bin/bash# scrape-news.shecho"标题,链接,时间" > news.csvfor page in $(seq 1 10); doecho"正在抓取第 ${page} 页..."  agent-browser open "https://news.example.com/latest?page=${page}"  agent-browser wait".article-list"# 获取文章数量  COUNT=$(agent-browser get count ".article-item" --json | jq -r '.count')for i in $(seq 1 $COUNT); do    TITLE=$(agent-browser get text ".article-item:nth-child(${i}) .title" --json | jq -r '.text')    LINK=$(agent-browser get attr ".article-item:nth-child(${i}) a" href --json | jq -r '.value')    TIME=$(agent-browser get text ".article-item:nth-child(${i}) .time" --json | jq -r '.text')echo"\"${TITLE}\",\"${LINK}\",\"${TIME}\"" >> news.csvdonesleep 2doneagent-browser closeecho"🎉 抓取完成，共 $(wc -l < news.csv) 条数据"

案例 5：搭配 OpenClaw 自然语言使用 🗣️

如果你在 OpenClaw 的 AI 对话环境中使用，可以直接用自然语言指挥：

👤 你：帮我打开 GitHub Trending 页面，截一张图🤖 AI：好的，我来操作...   → agent-browser open https://github.com/trending   → agent-browser wait --load networkidle   → agent-browser screenshot --full github-trending.png   截图已保存为 github-trending.png ✅

👤 你：去京东搜索 "机械键盘"，把前 5 个商品的名称和价格告诉我🤖 AI：正在搜索...   → agent-browser open https://www.jd.com   → agent-browser snapshot -i   → agent-browser fill @e1 "机械键盘"   → agent-browser click @e2   → agent-browser wait ".gl-item"   → 提取前 5 个商品信息...   搜索结果：   1. 罗技 K845 机械键盘 - ¥399   2. IKBC C87 机械键盘 - ¥299   3. Cherry MX Board 3.0 - ¥599   ...

👤 你：每小时检查一次 example.com/price，如果价格低于 100 元就通知我🤖 AI：已创建定时监控任务 ✅   → 每小时执行一次价格检查   → 低于 ¥100 时通过通知渠道提醒你

六、调试技巧与避坑指南

🔍 调试利器：有头模式

开发调试时，加上 --headed 参数可以看到浏览器的实际操作过程：

agent-browser open https://example.com --headed

⚠️ 常见坑点

🛡️ 使用注意事项

1. 1. 遵守法律：请遵守目标网站的 robots.txt 和服务条款
2. 2. 控制频率：加入适当的 sleep / wait，避免被封 IP
3. 3. 资源消耗：浏览器很吃内存，生产环境务必使用无头模式
4. 4. 数据安全：auth.json 包含敏感信息，注意加密保管

七、agent-browser vs 其他方案

九、总结

agent-browser 的核心价值在于——把浏览器操作的门槛降到了零。

不需要写 Python 脚本，不需要学 Selenium API，只需要几条命令（或者直接用自然语言），就能让 AI 帮你：

• • ✅ 自动填表提交，解放双手
• • ✅ 批量抓取数据，效率起飞
• • ✅ 竞品价格监控，实时响应
• • ✅ 每日自动签到，积分白拿
• • ✅ 网页截图录屏，存档备查

如果你还在每天花大量时间做重复的网页操作，强烈建议试试这个技能。把时间花在真正重要的事情上，跑腿的活儿交给 AI。

📚 参考资料

• • OpenClaw 官方文档 - 浏览器工具
• • agent-browser GitHub 仓库
• • ClawHub 技能市场
• • W3CSchool - Agent Browser 参考手册