167 lines
6.2 KiB
Markdown
167 lines
6.2 KiB
Markdown
# AI浏览器自动化技能
|
||
|
||
`浏览器自动化` `AI代理` `OpenClaw` `Browser-Use` `网页抓取`
|
||
|
||
# 🌐 OpenClaw 的 Browser-Use 技能
|
||
|
||
> **告别繁琐的截图→操作循环。** 让 AI 端到端处理复杂浏览器自动化任务。
|
||
|
||
[](https://clawhub.com)
|
||
[](LICENSE)
|
||
[](https://github.com/browser-use/browser-use)
|
||
[](https://github.com/abczsl520/browser-use-skill/wiki)
|
||
|
||
---
|
||
|
||
## 😤 问题所在
|
||
|
||
OpenClaw 内置的浏览器工具适合简单任务——截图、点击按钮，搞定。但面对**多步骤工作流**时，它就成了噩梦：
|
||
|
||
```
|
||
Agent: *截图* → *点错按钮* → *截图* → *页面变了* →
|
||
*困惑* → *再点一次* → *弹窗出现* → *彻底懵了* → ❌ 失败
|
||
```
|
||
|
||
是不是很熟悉？登录表单、动态页面、弹窗、反爬检测——内置工具根本不是为这些场景设计的。
|
||
|
||
## ✅ 解决方案
|
||
|
||
本技能集成了 [**Browser-Use**](https://github.com/browser-use/browser-use)（38k+ ⭐）——一个能**像人一样看页面**、自主完成整套工作流的 AI 浏览器代理。
|
||
|
||
```
|
||
你： "登录 Reddit 并把这篇文章发到 r/python"
|
||
Browser-Use: ✅ 打开登录页 → 输入凭证 → 等待 CAPTCHA →
|
||
跳转到发帖页 → 填写标题和正文 → 点击发布 → 返回 URL
|
||
```
|
||
|
||
**一个任务进去，结果出来。** 不需要手动一步步盯着它操作。
|
||
|
||
## ⚡ 快速开始
|
||
|
||
```bash
|
||
# 1. 安装技能
|
||
clawhub install browser-use
|
||
|
||
# 2. 配置 Python 环境（仅需一次）
|
||
python3 -m venv ~/browser-use-env
|
||
source ~/browser-use-env/bin/activate
|
||
pip install browser-use playwright langchain-openai
|
||
playwright install chromium
|
||
```
|
||
|
||
然后直接告诉你的 OpenClaw 代理：
|
||
|
||
> *"用 browser-use 登录 Reddit 发个帖子"*
|
||
|
||
技能会处理一切：模式选择、脚本生成、执行和错误恢复。
|
||
|
||
## 🤔 什么时候用哪个
|
||
|
||
| 场景 | 内置 `browser` | 本技能 |
|
||
|------|:---:|:---:|
|
||
| 截图 | ✅ 免费且即时 | ❌ 大材小用 |
|
||
| 点击一个按钮 | ✅ | ❌ |
|
||
| **5+ 步骤工作流**（登录→导航→填写→提交） | ❌ 容易出错 | **✅ 自主完成** |
|
||
| **反爬网站**（Reddit、LinkedIn、Twitter） | ❌ 会被识别 | **✅ 真实 Chrome** |
|
||
| **批量操作** | ❌ | **✅** |
|
||
| **复杂导航的数据抓取** | ❌ 需手动 | **✅ 智能处理** |
|
||
|
||
> **经验法则：** 如果需要超过 3 次点击，就用 Browser-Use。
|
||
|
||
## 🔑 核心特性
|
||
|
||
### 🎯 智能任务路由
|
||
技能能判断何时需要 Browser-Use、何时内置工具就够用，不浪费 API 调用。
|
||
|
||
### 🔐 安全凭证处理
|
||
密码通过占位符替换传递——LLM **永远看不到你的真实凭证**：
|
||
```python
|
||
agent = Agent(
|
||
task="使用 x_user 和 x_pass 登录",
|
||
sensitive_data={"x_user": "real@email.com", "x_pass": "S3cret!"},
|
||
)
|
||
```
|
||
|
||
### 🛡️ 反检测（真实 Chrome 模式）
|
||
通过 CDP 连接你实际的 Chrome 浏览器——网站看到的是真实用户，零检测风险：
|
||
```python
|
||
browser = Browser(cdp_url="http://127.0.0.1:9222")
|
||
```
|
||
|
||
### ⚡ 闪速模式
|
||
跳过 LLM 推理处理简单步骤——速度提升 2 倍：
|
||
```python
|
||
agent = Agent(task="...", flash_mode=True)
|
||
```
|
||
|
||
### 🔧 内置故障恢复
|
||
遇到 CAPTCHA？超时？反垃圾检测？技能内置了完整的常见故障决策树。
|
||
|
||
## 📖 快速示例
|
||
|
||
```python
|
||
import asyncio
|
||
from browser_use import Agent, ChatOpenAI, Browser
|
||
|
||
async def main():
|
||
llm = ChatOpenAI(model="gpt-4o-mini", api_key="YOUR_KEY")
|
||
browser = Browser(cdp_url="http://127.0.0.1:9222") # 真实 Chrome
|
||
|
||
agent = Agent(
|
||
task="""
|
||
1. 访问 https://news.ycombinator.com
|
||
2. 提取前 5 条故事的标题和 URL
|
||
3. 以格式化列表形式返回
|
||
""",
|
||
llm=llm, browser=browser, use_vision=True, max_steps=15,
|
||
)
|
||
result = await agent.run()
|
||
print(result)
|
||
|
||
asyncio.run(main())
|
||
```
|
||
|
||
## 🎮 LLM 兼容性
|
||
|
||
| LLM | 可用 | 适合场景 |
|
||
|-----|:---:|---------|
|
||
| GPT-4o-mini | ✅ | **默认选择**——快速且经济 |
|
||
| GPT-4o | ✅ | 复杂推理任务 |
|
||
| Claude 3.5+ | ✅ | 良好的替代方案 |
|
||
| Gemini | ❌ | 结构化输出不兼容 |
|
||
|
||
## 📚 文档
|
||
|
||
📖 **[完整 Wiki →](https://github.com/abczsl520/browser-use-skill/wiki)**
|
||
|
||
| 指南 | 内容 |
|
||
|------|------|
|
||
| [快速入门](https://github.com/abczsl520/browser-use-skill/wiki/Getting-Started) | 安装、配置、第一个自动化任务 |
|
||
| [模式 A vs 模式 B](https://github.com/abczsl520/browser-use-skill/wiki/Mode-A-vs-Mode-B) | 内置 Chromium vs 真实 Chrome |
|
||
| [任务编写指南](https://github.com/abczsl520/browser-use-skill/wiki/Task-Writing-Guide) | 写出一次成功的提示词 |
|
||
| [敏感数据](https://github.com/abczsl520/browser-use-skill/wiki/Sensitive-Data) | 安全的密码处理 + 双因素认证 |
|
||
| [实战示例](https://github.com/abczsl520/browser-use-skill/wiki/Real-World-Examples) | 可直接复用的代码片段 |
|
||
| [故障排查](https://github.com/abczsl520/browser-use-skill/wiki/Troubleshooting) | 修复常见问题 |
|
||
| [常见问题](https://github.com/abczsl520/browser-use-skill/wiki/FAQ) | 快速解答 |
|
||
|
||
## 🔗 相关项目
|
||
|
||
- [Browser-Use](https://github.com/browser-use/browser-use) — 底层浏览器 AI 框架（38k+ ⭐）
|
||
- [OpenClaw](https://github.com/openclaw/openclaw) — 本技能运行的 AI 代理平台
|
||
- [Bug Audit](https://github.com/abczsl520/bug-audit-skill) — 动态漏洞挖掘（200+ 模式）
|
||
- [Debug Methodology](https://github.com/abczsl520/debug-methodology) — AI 代理的根因调试方法
|
||
- [Game Quality Gates](https://github.com/abczsl520/game-quality-gates) — 12 项通用游戏开发质量检查
|
||
|
||
## 🤝 贡献
|
||
|
||
发现了 bug？有好想法？[提交 issue](https://github.com/abczsl520/browser-use-skill/issues) 或发 PR！
|
||
|
||
## 📄 许可证
|
||
|
||
[MIT](LICENSE) — 随意使用。
|
||
|
||
---
|
||
|
||
<p align="center">
|
||
<b>⭐ 如果本技能节省了你的时间，欢迎给仓库点个 Star——这能帮助更多人找到它！</b>
|
||
</p> |