用 OpenClaw 实现浏览器自动化
用 OpenClaw 实现 AI 驱动的浏览器自动化：网页抓取、表单填写、截图采集、数据提取和多步骤 Web 工作流，用自然语言描述即可执行。
最近更新: 2026-03-31
你将搭建什么
一套浏览器自动化能力，让 OpenClaw 能够：
- 浏览网页 — 打开页面、点击按钮、填写表单、滚动浏览
- 提取数据 — 从网页、表格和看板中抓取结构化数据
- 截取截图 — 全页或特定元素的截图，用于报告
- 执行多步工作流 — 将浏览器操作串联成复杂的自动化流程
搭建完成后，你只需用自然语言描述想做什么，就能自动化任何浏览器操作。
为什么用 AI 做浏览器自动化
传统浏览器自动化工具（Selenium、Puppeteer、Playwright）功能强大，但每个工作流都需要编写和维护代码。网站改了布局，脚本就挂了。需要新的工作流，就得写新脚本。
AI 驱动的浏览器自动化改变了这一点：
- 自然语言指令 — 描述你要做什么，而不是写选择器和点击处理器
- 自适应修复 — AI 能适应 UI 变化，不需要更新脚本
- 零代码维护 — 工作流由意图定义，而非实现细节
- 快速搭建 — 几分钟搭好一个新自动化，而不是几小时
- 视觉理解 — AI 能解读页面布局、识别截图中的文字、根据所见做决策
前置条件
- OpenClaw 已安装并配置好（快速上手指南）
- Chrome 或 Chromium 已安装
- Node.js 18+
第 1 步：安装所需 Skills
# 1. 浏览器控制 npx clawhub@latest install browser-use # 2. 网页数据提取 npx clawhub@latest install web-scraper # 3. 截图采集 npx clawhub@latest install screenshot
第 2 步：验证浏览器环境
browser-use Skill 需要 Chrome/Chromium：
clawhub inspect browser-use
会检查是否有兼容的浏览器并显示检测到的路径。如果 Chrome 没有被自动找到，在 Skill 配置中手动设置路径。
第 3 步：浏览器自动化实战
示例 1：从数据看板提取指标
假设你每天早上需要从一个 Web 看板拉取数据：
Open https://analytics.example.com, log in with my saved credentials, navigate to the Daily Metrics page, and extract the table showing yesterday's KPIs into a Markdown table.
浏览器 Skill 处理登录、导航和数据提取。结果是一份干净的 Markdown 表格，可以直接粘贴到报告或 Slack 中。
示例 2：监控竞品定价页面
Go to competitor.com/pricing, take a screenshot of the pricing table, and extract all plan names, prices, and feature lists into JSON format.
输出：
{
"plans": [
{
"name": "Starter",
"price": "$29/month",
"features": ["5 users", "10GB storage", "Email support"]
},
{
"name": "Professional",
"price": "$79/month",
"features": ["25 users", "100GB storage", "Priority support", "API access"]
},
{
"name": "Enterprise",
"price": "Custom",
"features": ["Unlimited users", "Unlimited storage", "24/7 support", "SSO", "Audit logs"]
}
]
}
示例 3：自动填表
Open the internal expense report form at expenses.company.com, fill in: date = today, category = "Software", amount = $49.99, description = "ClawHub Pro subscription", then submit.
示例 4：多步骤调研工作流
1. Search Google for "best CI/CD tools 2026 comparison" 2. Open the top 3 results 3. Extract the main comparison points from each article 4. Compile into a summary table
第 4 步：截图用于报告
Screenshot Skill 为报告和监控采集视觉证据：
# 全页截图 clawhub run screenshot --url "https://status.example.com" --full-page # 特定元素 clawhub run screenshot --url "https://grafana.example.com/d/api-latency" --selector ".panel-container" # 多个页面 clawhub run screenshot --urls "url1,url2,url3" --output "./screenshots/"
定时视觉监控
配合 Cron 每天采集快照：
clawhub run cron --schedule "0 9 * * *" --task "screenshot --url https://status.example.com --output ~/snapshots/{{date}}.png"
进阶：复杂工作流
串联浏览器操作
需要稳定运行的多步工作流：
# .openclaw/browser-workflow.yml
workflow:
name: "每日指标采集"
steps:
- action: navigate
url: "https://analytics.example.com"
- action: login
credentials: "analytics_dashboard"
- action: click
target: "Daily Report tab"
- action: wait
condition: "table is fully loaded"
- action: extract
target: "metrics table"
format: "csv"
- action: screenshot
target: "full page"
- action: save
output: "~/reports/{{date}}-metrics.csv"
处理登录认证
需要登录的站点：
credentials:
analytics_dashboard:
url: "https://analytics.example.com/login"
username_field: "#email"
password_field: "#password"
# 凭据存储在 OpenClaw 的安全凭据库中
用 clawhub credentials set analytics_dashboard 安全存储登录信息。
处理 SPA 和动态内容
现代单页应用动态加载内容。浏览器 Skill 自动处理：
- 等待网络请求完成
- 检测页面是否完全渲染
- 内容未加载时自动重试
对于特别慢的页面，可以设置明确的等待条件：
Navigate to the dashboard and wait until the chart labeled "Revenue" is visible before taking a screenshot.
常见问题排查
浏览器启动失败
- 确认 Chrome/Chromium 已安装：
which google-chrome或which chromium - 检查 Skill 配置中的路径：
clawhub inspect browser-use - 在无 GUI 服务器上，确认配置中启用了
--no-sandbox标志
页面内容不加载
- 某些页面需要 JavaScript——浏览器 Skill 运行完整浏览器，默认支持
- 检查是否有 Cookie 同意弹窗阻挡了内容
- 确认 URL 从你的机器可以访问（VPN、防火墙）
截图空白或不完整
- 截图前加等待时间——页面可能还在渲染
- 需要滚动的页面使用
--full-page参数 - 检查页面是否需要登录
提取到错误的数据
- 更具体地描述要提取的元素
- 使用视觉描述："第二个区域中的表格"或"右边的定价卡片"
- 对于复杂页面，先截图确认页面状态，再提取
常见问题
不一样。传统自动化工具需要写代码，用明确的选择器（如 `document.querySelector('.price-table')`）。OpenClaw 的浏览器自动化用 AI 从视觉和语义上理解页面——你用自然语言描述想做什么，它自动找到怎么操作。这让它对 UI 变化更有韧性，搭建速度也快得多。
可以。浏览器 Skill 支持凭据管理。用 `clawhub credentials set` 安全存储凭据，Skill 会自动处理登录流程。支持标准的用户名/密码表单、OAuth 重定向和 Basic Auth。
网页抓取的合法性取决于站点的服务条款、抓取的数据类型和你所在的法律管辖区。一般来说，抓取公开数据供个人使用是可以接受的。务必查看站点的 `robots.txt` 和服务条款。不要未经许可抓取个人数据、受版权保护的内容或需要登录才能看到的数据。OpenClaw 不会绕过验证码或访问限制。
浏览器 Skill 不会自动解决验证码。如果站点弹出验证码，工作流会暂停并通知你。对于经常访问的站点，手动登录一次并保存会话 Cookie，通常可以避免重复触发验证码。
可以。浏览器 Skill 支持无头模式（headless mode），不需要显示窗口。在没有图形界面的服务器上默认使用无头模式。在配置中设置 `headless: true` 或传入 `--headless` 参数。所有功能在无头模式下完全一致。
每个浏览器实例大约占用 200-500MB 内存。如果同时运行多个工作流，按比例规划内存。CPU 在页面渲染和截图时会有峰值，等待期间占用很低。对于定时任务，浏览器在每次运行时启动和关闭，资源只在执行期间占用。