catalog/repos/abczsl520--browser-use-skill.md

167 lines
6.2 KiB
Markdown
Raw Normal View History

2026-04-06 22:24:03 +08:00
# AI浏览器自动化技能
`浏览器自动化` `AI代理` `OpenClaw` `Browser-Use` `网页抓取`
# 🌐 OpenClaw 的 Browser-Use 技能
> **告别繁琐的截图→操作循环。** 让 AI 端到端处理复杂浏览器自动化任务。
[![ClawHub](https://img.shields.io/badge/ClawHub-browser--use-blue?style=flat-square)](https://clawhub.com)
[![License: MIT](https://img.shields.io/badge/License-MIT-green?style=flat-square)](LICENSE)
[![Browser-Use](https://img.shields.io/badge/Powered_by-Browser--Use-orange?style=flat-square)](https://github.com/browser-use/browser-use)
[![Wiki](https://img.shields.io/badge/📖_Wiki-7_pages-purple?style=flat-square)](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>