浏览器自动化实验室

一个专注于学习和集成浏览器自动化框架的平台,支持Skyvern和Browser-Use框架,提供多代理架构和MCP集成。

  • by daddy-dev-id
  • Python
  • 本地部署
  • 更新于
在 GitHub 查看 daddy-dev-id/mcp-browser-automation-lab

使用说明

MCP浏览器自动化实验室

一个专注于学习的平台,用于探索集成模型上下文协议(MCP)的浏览器自动化框架。

这个项目提供了一个干净、富有教育意义的环境,用于学习和融合 Skyvern(斯凯文) 并且 浏览器使用 提供动手实践的框架以及全面的学习资源。

关于

MCP浏览器自动化实验室是一个以学习为中心的平台,旨在探索并整合浏览器自动化框架与模型上下文协议(MCP)。它为使用Skyvern和Browser-Use框架进行动手实验提供了一个简洁、教育性强的环境。

以学习为中心的方法

  • 安全实验专门用于测试的专用游乐场,不影响主代码
  • 清洁架构外部框架与您的实现之间的清晰分离
  • 全面的文档资料分步指南和学习资源
  • 单一仓库结构单一开发环境,共享工具链
  • 框架对比不同自动化方法的并排分析

支持的框架

主要特点:

  • 多智能体架构专门负责规划、执行、验证和导航的代理
  • MCP 集成通过模型上下文协议实现原生光标编辑器集成
  • 高级自动化验证码处理、反机器人检测、自我修复能力
  • **工作流链接(或工作流串联)**将多个自动化任务串联起来
  • 实时监控用于调试和监督的实时直播视图

多智能体架构

Skyvern采用了一种复杂的多智能体架构,其中专门的智能体负责处理自动化过程的不同方面:

计划制定代理

将复杂目标分解为可执行步骤,利用人工智能理解高层目标,并将其细化为具体、可执行的任务。

演员经纪人

根据规划者的指示执行网页交互操作,精准处理点击、输入、导航和数据提取任务。

验证代理

确保任务完成并处理错误纠正,验证每项操作是否成功,并在需要时提供恢复建议。

导航代理

理解网站结构,寻找高效路径,分析网站布局以优化导航并减少自动化时间。

工作流编排器

为复杂工作流协调所有代理,管理代理间的交互,并确保多步骤流程的顺利执行。

特点/功能

  • 多智能体系统专门负责规划、执行、验证和导航的代理
  • MCP集成通过模型上下文协议实现原生光标编辑器集成
  • 高级自动化验证码处理、反机器人检测、自我修复能力
  • **工作流链接(或工作流串联)**无缝串联多个自动化任务
  • 实时监控用于调试和监督的实时流视图窗口
  • **支持多个大型语言模型(LLM)**包括OpenAI、Anthropic、Google、Ollama在内的8家以上大型语言模型(LLM)提供商
  • **行业数据抓取工具(或行业爬虫)**为电子商务、社交媒体、招聘、新闻预建的抓取工具
  • Docker 支持通过docker-compose进行容器化部署
  • 灵活部署本地运行或使用云服务

🎯 使用场景

数据提取

  • 电子商务产品信息、定价、评价、库存
  • 社交媒体评论、帖子、用户资料、互动指标
  • 就业平台职位列表、公司信息、薪资数据
  • 新闻与媒体文章、头条新闻、热门话题、情感分析

表单自动化

  • 获取潜在客户信息通过自然语言实现潜在客户生成表单的自动化
  • 数据收集简化跨站点的数据收集流程
  • 政府表格浏览并填写政府网页表格
  • 工作申请求职申请流程的全面自动化

复杂的工作流程

  • 多步骤导航复杂的用户旅程和工作流程
  • 跨平台自动化在不同平台上使用相同的逻辑
  • 实时监控跟踪并响应网站变更
  • 批处理处理大规模自动化任务

快速入门

先决条件

  • Python 3.11及以上版本
  • Docker(用于容器化部署)
  • Git(一种分布式版本控制系统)

安装

选项1:DevContainer(推荐)

# Clone the repository
git clone https://github.com/daddy-dev-id/browser-automation-mcp-develop.git
cd browser-automation-mcp-develop

# Open in VS Code with DevContainer
# Press Ctrl+Shift+P -> "Dev Containers: Reopen in Container"
# Wait for container to build and start

# Test the setup
make test-mcp

选项2:本地安装

# Clone the repository
git clone https://github.com/daddy-dev-id/browser-automation-mcp-develop.git
cd browser-automation-mcp-develop

# Create virtual environment
python3 -m venv venv
source venv/bin/activate  # On Windows: venv\Scripts\activate

# Install dependencies
pip install -r requirements.txt

# Install the package
pip install -e .

# Install Playwright browsers
playwright install chromium --with-deps

环境配置

创建一个 .env 文件:

# Skyvern Configuration
SKYVERN_API_KEY=your-skyvern-api-key
SKYVERN_BASE_URL=https://api.skyvern.com/api/v1

# LLM Configuration
LLM_KEY=OPENAI  # or ANTHROPIC, GEMINI, etc.
OPENAI_API_KEY=your-openai-api-key

# MCP Configuration
MCP_SERVER_NAME=browser-automation

运行Skyvern(注:Skyvern可能是一个特定软件、系统或项目的名称,根据上下文可能需要具体翻译或解释)

# Start the MCP server
make start-mcp

# Test the connection
make test-mcp

# Run a simple automation
python -c "
from backend.core.workflow_orchestrator import WorkflowOrchestrator
import asyncio

async def main():
    orchestrator = WorkflowOrchestrator()
    await orchestrator.initialize()
    
    result = await orchestrator.execute_workflow(
        'Navigate to Google and search for Skyvern',
        {'base_url': 'https://google.com'}
    )
    
    print(f'Workflow completed: {result.status}')
    print(f'Steps completed: {result.steps_completed}/{result.total_steps}')
    
    await orchestrator.cleanup()

asyncio.run(main())
"

项目结构

mcp-browser-automation-lab/
├── external/                     # Cloned external frameworks
│   ├── skyvern/                  # Skyvern repository
│   └── browser-use/              # Browser-Use repository
├── packages/                     # Your implementation code
│   ├── core/                     # Shared utilities and types
│   ├── adapters/                 # Framework integration adapters
│   │   ├── skyvern-adapter/      # Skyvern integration
│   │   └── browser-use-adapter/  # Browser-Use integration
│   ├── mcp-server/               # MCP server implementation
│   ├── api-gateway/              # Optional REST/WebSocket layer
│   └── cli/                      # Development CLI tools
├── playgrounds/                  # Safe experimentation spaces
│   ├── skyvern-tests/            # Skyvern learning examples
│   ├── browser-use-tests/        # Browser-Use learning examples
│   └── mcp-experiments/          # MCP protocol experiments
├── scripts/                      # Utility scripts
├── docs/                         # Learning documentation
└── .devcontainer/                # Development environment

支持的大型语言模型(LLM)提供商

Skyvern支持8+家大型语言模型(LLM)提供商,实现灵活部署:

OpenAI(一家人工智能研究实验室)

  • 模型GPT-4o,GPT-4o-mini,GPT-4-turbo,GPT-3.5-turbo
  • 配置设定 OPENAI_API_KEY 并且 LLM_KEY=OPENAI

Anthropic(公司名,可译为“安萨里奇”或根据官方中文名翻译,此处保留原英文以体现专有名词特性)

  • 模型Claude 3.5 Sonnet,Claude 3(Haiku、Sonnet、Opus)
  • 配置设定/套装 ANTHROPIC_API_KEY 并且 LLM_KEY=ANTHROPIC

Google Gemini

  • 模型双子座2.5专业版,双子座2.5闪存版,双子座2.0
  • 配置设定/套装 GEMINI_API_KEY 并且 LLM_KEY=GEMINI_2.5_PRO_PREVIEW

Azure OpenAI(注:Azure是微软的云计算服务平台,OpenAI是一家专注于人工智能研究的公司,两者结合即指微软提供的OpenAI服务或平台)

  • 模型所有Azure GPT模型
  • 配置设置 AZURE_OPENAI_API_KEY 并且 LLM_KEY=AZURE_OPENAI

AWS Bedrock

  • 模型Anthropic的Claude模型
  • 配置设置AWS凭证并 LLM_KEY=BEDROCK

Ollama(注:Ollama是一个用于训练和运行大型语言模型的开源框架,直接翻译为“奥拉玛”可能无法准确传达其专业含义,因此在此保留原英文名称。)

  • 模型本地模型(Qwen2.5、Mistral 等)
  • 配置设置 OLLAMA_SERVER_URL 并且 LLM_KEY=OLLAMA

OpenRouter

  • 模型通过OpenRouter API的各种模型
  • 配置设置 OPENROUTER_API_KEY 和 LLM_KEY=OPENROUTER

“OpenAI-Compatible”可以翻译为“与OpenAI兼容的”或“符合OpenAI标准的”。这里,“OpenAI-Compatible”指的是某个系统、模型或技术与OpenAI(一个致力于促进人工智能安全和有益发展的研究实验室)所开发的技术或标准相兼容或相契合

  • 模型自定义端点(Together AI、本地模型)
  • 配置设定/设置 OPENAI_COMPATIBLE_API_BASE 和 LLM_KEY=OPENAI_COMPATIBLE

可用的MCP工具

核心自动化工具

  • **skyvern_automate**使用Skyvern引擎运行自动化任务
  • **browser_use_automate**使用浏览器使用引擎运行自动化任务
  • **compare_engines**在相同任务上比较这两款发动机

实用工具

  • **get_engine_info**获取可用引擎的信息
  • **browser_use_health_check**检查浏览器-使用引擎健康状况

🎯 引擎对比

功能 Skyvern 浏览器使用
人工智能集成 视觉+文本 由大型语言模型驱动
云服务 ✅ Skyvern Cloud(可译为“思凯云”或根据具体品牌策略保留原名,因“Skyvern”并无固定中文译名,需结合品牌定位和语境决定) ✅ 浏览器-使用云服务
本地设置 ✅ Docker Stack(Docker 栈) ✅ Playwright(自动化测试工具)
隐身特性 基础版 ✅ 高级版
MCP 支持 ❌ ✅ 原生
工作流链接(或工作流串联) ✅ 支持 ❌ 不支持
Chrome 扩展程序 ✅ 可用 ❌ 不可用
动作记录器 ✅ 向用户学习 ❌
视口流式传输 ✅ 现场直播 ❌
两步验证(2FA)支持 ✅ TOTP ❌
密码管理器 ✅ Bitwarden ❌
最适合/最适用于 数据提取,工作流 通用自动化

🔗 Skyvern 集成

工作流程自动化

  • **Zapier(可译为“扎皮尔”或根据上下文保留原名,若作为技术或服务名称,通常直接使用原名)**将Skyvern与5000多个应用程序连接起来
  • **Make.com(注:Make.com是一个提供低代码/无代码平台服务的公司名称,直接翻译为“制作点”或“创客点”并不准确,因此通常保留原名或根据上下文进行适当解释,但在此处仅做字面翻译说明)**可视化工作流自动化
  • N8N开源工作流自动化

浏览器集成

  • Chrome扩展程序浏览器与语音模式的直接集成
  • 动作记录器监控用户行为并生成工作流程
  • 视口流式传输实时流媒体浏览器交互

安全与认证

  • **支持双重验证(2FA)**TOTP(基于时间的一次性密码)
  • 密码管理器Bitwarden 集成
  • 凭证管理安全凭证存储

🛠️ 技术栈

核心技术

  • **Python 3.11+**主要语言
  • **模型上下文协议(MCP)**Claude Desktop 集成
  • 剧作家浏览器自动化引擎
  • Docker容器化与部署
  • **JSON(JavaScript Object Notation,JavaScript对象表示法)**结构化数据输出

支持的引擎

  • **Skyvern(斯凯文)**基于计算机视觉的AI驱动浏览器自动化
  • 浏览器使用带有隐身功能的LLM驱动浏览器自动化

支持的LLM(大型语言模型)提供商

  • **OpenAI(开放人工智能研究所)**GPT-4o,GPT-4o-mini,GPT-4-turbo
  • **Anthropic(公司名,可译为“安萨里克”或根据具体语境保留原名)**Claude 3.5 Sonnet,Claude 3(Haiku、Sonnet、Opus)
  • Azure OpenAI所有Azure GPT模型
  • AWS BedrockAnthropic的Claude模型系列
  • Google Gemini2.5专业版,2.5 Flash版,2.0版
  • **Ollama(注:Ollama是一个开源的机器学习框架,此处直接音译,实际使用时可能需要根据上下文或品牌官方译名进行调整)**本地大语言模型支持(Qwen2.5、Mistral 等)
  • OpenRouter通过OpenRouter API的各种模型
  • “OpenAI-Compatible”可以翻译为“与OpenAI兼容的”或“符合OpenAI标准的”。这个术语通常用于描述某种系统、模型或技术能够与OpenAI的系统或标准进行兼容或交互自定义端点(Together AI、本地模型)

📊 行业数据抓取工具

电子商务

  • 亚马逊畅销书产品信息、价格、评价
  • eBay产品拍卖商品和一口价商品
  • Shopify 商店适用于Shopify驱动商店的通用抓取工具

社交媒体

  • YouTube评论视频评论和元数据
  • Twitter/X帖子推文和用户信息
  • **领英(LinkedIn)**公司和职位信息

就业平台

  • 喜马拉雅工作职位列表和公司信息
  • **确实的工作(或:真正的职位)**求职搜索结果及公司评价
  • **LinkedIn 职位(或:LinkedIn招聘)**专业职位列表

新闻与媒体

  • Google新闻新闻文章和热门话题
  • **Reddit(一个社交新闻聚合网站)**帖子和评论
  • BBC新闻突发新闻和文章

功能路线图

这是我们未来几个月的计划路线图。如果您有任何建议或希望看到某个功能的添加,请随时通过电子邮件或GitHub问题与我们联系。

  • 多智能体架构 ✅ - 实现了用于规划、执行、验证和导航的专用代理
  • MCP 集成 ✅ - 通过模型上下文协议集成原生光标编辑器
  • 工作流串联(或工作流链接) - 允许将多个Skyvern调用串联在一起
  • 优化后的上下文 - 提升Skyvern理解可交互元素周围内容的能力
  • 成本节约 - 提高Skyvern的稳定性并降低其运行成本
  • 自助服务用户界面 - 基于React的用户界面组件,用于启动新任务
  • 工作流用户界面构建器 - 可视化用户界面,用于构建和分析工作流
  • Chrome 视口流式传输 - 将Chrome视口实时流式传输到用户的浏览器
  • 过去的运行界面(或“历史运行界面”) - 基于React的用户界面,用于可视化过往运行及其结果
  • 自动工作流构建器 - 允许Skyvern在导航时自动生成工作流程
  • 提示缓存 - 为LLM调用设置缓存层以降低成本
  • 网络评估数据集 - 与公共基准测试集成
  • 增强的调试模式 - 制定行动计划并获得批准后再执行
  • Chrome 扩展程序 - 允许用户通过Chrome扩展程序与Skyvern进行交互
  • Skyvern动作记录器 - 观察用户完成任务并生成工作流程
  • Langchain 集成 - 在langchain_community中创建langchain集成

测试

# Run all tests
make test

# Test MCP server
make test-mcp

# Test engines
make test-engines

# Compare engines
make compare-engines

🐳 Docker 使用方法

本地开发

# Start local Skyvern stack
docker-compose -f deployment/docker-compose-local.yml up -d

# Start MCP server
python -m mcp_browser_automation.mcp.server

生产部署

# Start all services
docker-compose -f deployment/docker-compose.yml up -d

# Check status
docker-compose ps

📚 文档

  • 入门指南 - 安装指南和快速入门指南
  • 指南 - MCP设置、引擎和刮板的全面指南
  • API 参考文档 - 完善API文档和MCP工具
  • 示例 - 实际案例和应用场景
  • 发展 - 项目结构、贡献和部署
  • 示例 - 使用示例和工作流程

🚨 故障排除

常见问题

  1. MCP服务器无法启动

    # Check Python path and dependencies
    which python
    pip list | grep browser-automation
    
  2. Claude Desktop 无法检测到 MCP 服务器

    • 验证配置文件路径
    • 检查JSON语法
    • 重启Claude桌面版
  3. API密钥问题

    • 验证API密钥是否正确
    • 检查环境变量
    • 手动测试API密钥
  4. 浏览器问题

    # Reinstall Playwright browsers
    uvx playwright install chromium --with-deps --no-shell
    

做出贡献

我们欢迎拉取请求(PRs)和建议!请随时通过提交拉取请求/问题或通过电子邮件或GitHub讨论与我们联系。请查阅我们的贡献指南和“寻求帮助”的问题以开始参与!

开发环境设置

  1. 为仓库创建分支(或:克隆仓库)
  2. 创建一个特性分支(git checkout -b feature/amazing-feature)
  3. 设置开发环境:
    # Install dependencies
    pip install -r requirements.txt
    pip install -e .
    
    # Install frontend dependencies
    cd frontend
    npm install
    cd ..
    
    # Run tests
    make test
    
  4. 提交你的更改(git commit -m 'Add amazing feature')
  5. 推送到分支(git push origin feature/amazing-feature)
  6. 提交一个拉取请求

遥测

默认情况下,Skyvern 会收集基本的使用统计数据,以帮助我们了解 Skyvern 的使用情况。如果您希望选择退出遥测数据收集,请设置 SKYVERN_TELEMETRY 环境变量至 false。

许可证

Skyvern的开源仓库通过托管云提供支持。除托管云服务中提供的反机器人措施外,Skyvern所有核心逻辑均在此开源仓库中提供,且采用AGPL-3.0许可证授权。

如果您对许可方面有任何问题或疑虑,请联系我们,我们将乐意为您提供帮助。

致谢

📞 支持

  • 📧 电子邮件符号,通常用于表示电子邮箱或电子邮件。 问题: GitHub Issues(GitHub问题)
  • 📖(书本的符号,可直接用作表示书籍或阅读的意象,无直接对应中文翻译,若需解释性翻译,可表述为“一本书”或“表示书籍的符号”) 文档: 项目维基
  • 💬 讨论: GitHub 讨论区

准备好使用Claude Desktop自动化浏览器了吗? 看看这个 MCP设置指南 开始吧! 🚀