MCP Browser Automation Lab

MCP浏览器自动化实验室

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

关于

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

以学习为中心的方法

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

支持的框架

• Skyvern（斯凯文）利用计算机视觉实现多智能体浏览器自动化
• 浏览器使用支持MCP的LLM驱动浏览器自动化

主要特点：

• 多智能体架构专门负责规划、执行、验证和导航的代理
• 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 集成

工作流程自动化

• 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

1. Claude Desktop 无法检测到 MCP 服务器

- 验证配置文件路径 - 检查JSON语法 - 重启Claude桌面版

1. API密钥问题

- 验证API密钥是否正确 - 检查环境变量 - 手动测试API密钥

1. 浏览器问题

   # 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

1. 提交你的更改（git commit -m 'Add amazing feature'）
2. 推送到分支（git push origin feature/amazing-feature）
3. 提交一个拉取请求

遥测

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

许可证

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

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

致谢

• Skyvern（斯凯文） — 开源的AI驱动浏览器自动化平台（AGPL-3.0）
• Skyvern Cloud（斯基弗恩云） — 提供托管云服务，配备高级防机器人措施
• 模型上下文协议 — MCP规范
• 剧作家 — 浏览器自动化引擎
• Claude Desktop（中文可译为“克劳德桌面版”或根据具体语境简化为“克劳德桌面”，但通常保留原名以体现其品牌特性） — 支持MCP的AI助手

📞 支持

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

______________________________________________________________________

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