Steel MCP 服务器

https://github.com/user-attachments/assets/25848033-40ea-4fa4-96f9-83b6153a0212

这是一个模型上下文协议（MCP）服务器，它使像 Claude 这样的大型语言模型能够通过基于 Puppeteer 的工具和 Steel 在网络上导航。基于 Web Voyager 框架，它提供了用于所有标准网页操作（如点击、滚动、输入等）以及截图的工具。

请 Claude 帮助你完成以下任务：

• "搜索一个食谱并保存配料清单"
• "跟踪包裹递送状态"
• "查找并比较特定产品的价格"
• "填写在线工作申请"

🚀 快速开始

以下是运行 Steel Voyager 内部 Claude Desktop 的简化指南。您只需调整环境选项即可在 Steel Cloud 和本地/自托管实例之间切换。

先决条件

1. 安装最新版本的 Git 和 Node.js
2. 安装 Claude Desktop
3. （可选）如果您计划自托管，请运行 Steel Docker 镜像 本地
4. （可选）如果运行 Steel Cloud，请带上您的 API 密钥。在此处获取 API 密钥。

A) 快速开始 (Steel Cloud)

1. 克隆并构建项目：

   git clone https://github.com/steel-dev/steel-mcp-server.git
   cd steel-mcp-server
   npm install
   npm run build
   

2. 配置 Claude Desktop (~/Library/Application Support/Claude/claude_desktop_config.json)，添加服务器条目：

   {
     "mcpServers": {
       "steel-puppeteer": {
         "command": "node",
         "args": ["path/to/steel-voyager/dist/index.js"],
         "env": {
           "STEEL_LOCAL": "false",
           "STEEL_API_KEY": "YOUR_STEEL_API_KEY_HERE",
           "GLOBAL_WAIT_SECONDS": "1"
         }
       }
     }
   }
   

   • 将 "YOUR_STEEL_API_KEY_HERE" 替换为您的有效 Steel API 密钥。
   • 确保 "STEEL_LOCAL" 设置为 "false" 以启用云模式。

3. 启动 Claude Desktop。它将自动以云模式启动此 MCP 服务器。

4. （可选）您可以在 仪表板 中查看或管理活跃的 Steel 浏览器会话。

B) 快速开始 (本地/自托管 Steel)

1. 确保你的本地或自托管的Steel服务正在运行（例如，使用开源的Steel Docker镜像）。

2. 克隆并构建项目（如果尚未完成，请按照上述步骤操作）：

   git clone https://github.com/steel-dev/steel-mcp-server.git
   cd steel-mcp-server
   npm install
   npm run build
   

3. 配置Claude Desktop (~/Library/Application Support/Claude/claude_desktop_config.json) 以支持本地模式：

   {
     "mcpServers": {
       "steel-puppeteer": {
         "command": "node",
         "args": ["path/to/steel-voyager/dist/index.js"],
         "env": {
           "STEEL_LOCAL": "true",
           "STEEL_BASE_URL": "http://localhost:3000",
           "GLOBAL_WAIT_SECONDS": "1"
         }
       }
     }
   }
   

   • "STEEL_LOCAL" 必须设置为 "true"。
   • 如果你在云服务器上自行托管，则需要配置 "STEEL_BASE_URL" 指向你的本地/自托管Steel URL。

4. 启动Claude Desktop，它将连接到你本地运行的Steel，并在本地模式下启动Steel Voyager。

5. （可选）要本地查看会话，你可以访问自托管的仪表盘(localhost:5173) 或者查看特定于你的Steel运行时环境的日志。

就是这样！一旦Claude Desktop启动，它将在后台协调MCP服务器，并让你通过Steel Voyager与网页自动化功能进行交互。

有关更多设置信息或遇到问题，请参阅MCP设置文档：https://modelcontextprotocol.io/quickstart/user

组件

工具

• navigate

  • 导航到浏览器中的任何 URL
  • 输入：
    • url (字符串，必填)：要导航到的 URL（例如 "https://example.com"）。

• search

  • 通过导航到 "https://www.google.com/search?q=encodedQuery" 来执行 Google 搜索。
  • 输入：
    • query (字符串，必填)：要在 Google 上搜索的文本。

• click

  • 使用编号标签点击页面上的元素
  • 输入：
    • label (数字，必填)：要点击的元素的标签号。

• type

  • 使用编号标签在输入字段中键入文本
  • 输入：
    • label (数字，必填)：输入字段的标签号。
    • text (字符串，必填)：要在字段中键入的文本。
    • replaceText (布尔值，可选)：如果为 true，则替换字段中的任何现有文本。

• scroll_down

  • 向下滚动页面
  • 输入：
    • pixels (整数，可选)：向下滚动的像素数。如果未指定，则滚动一整页。

• scroll_up

  • 向上滚动页面
  • 输入：
    • pixels (整数，可选)：向上滚动的像素数。如果未指定，则滚动一整页。

• go_back

  • 导航到浏览器历史记录中的上一个页面
  • 无需输入

• wait

  • 等待最多 10 秒，适用于加载缓慢或需要更多时间来显示动态内容的页面。
  • 输入：
    • seconds (数字，必填)：等待的秒数（0 到 10）。

• save_unmarked_screenshot

  • 捕获当前页面而不带边界框或高亮，并将其存储为资源。
  • 输入：
    • resourceName (字符串，可选)：用于存储截图的名称（例如 "before_login"）。如果省略，则自动生成通用名称。

资源

• 截图：
  每个保存的截图都可以通过 MCP 资源 URI 访问，格式如下：
  • screenshot://RESOURCE_NAME

  当您指定 "save_unmarked_screenshot" 工具或某个操作（对于大多数工具）以带有注释的截图结束时，服务器会存储这些截图。这些图像可以通过标准的 MCP 资源检索请求获取。

（注意：虽然控制台日志仍会被收集用于分析和调试，但在此实现中它们不作为可检索资源公开。它们出现在服务器的日志中，但不会通过 MCP 资源 URI 提供。）

主要功能

• 使用 Puppeteer 进行浏览器自动化
• 通过 Steel 集成进行浏览器会话管理
• 通过编号标签进行视觉元素识别
• 截图功能
• 基本的网页交互（导航、点击、表单填写）
• 通过滚动支持延迟加载
• 支持本地和远程 Steel 实例

了解边界框

在与页面交互时，Steel Puppeteer 会添加视觉叠加层以帮助识别可交互元素：

• 每个交互元素（按钮、链接、输入框）都会获得一个唯一的编号标签
• 彩色框勾勒出元素的边界
• 标签出现在元素上方或内部，以便于参考
• 在指定点击或输入操作的元素时使用这些编号

配置

Steel Voyager 可以在两种模式下运行："本地" 或 "云端"。这种行为由环境变量控制。以下是一个简要概述：

本地模式

1. 设置 STEEL_LOCAL="true"。
2. （可选）如果您将 Steel 服务器托管在自定义域名上，请设置 STEEL_BASE_URL 指向该服务器。否则，Steel Voyager 将默认指向 http://localhost:3000。
3. 此模式下不需要 API 密钥。
4. Puppeteer 将通过 ws://0.0.0.0:3000 连接。

示例：

export STEEL_LOCAL="true"

export STEEL_BASE_URL="[http://localhost:3000](https://link.3)" # 仅当需要覆盖时

云端模式

1. 设置 STEEL_LOCAL="false"。
2. 设置 STEEL_API_KEY 以便 Steel Voyager 可以与 Steel 云服务（或者您自己托管的 Steel 如果更改了 STEEL_BASE_URL）进行身份验证。
3. STEEL_BASE_URL 默认为 https://api.steel.dev；如果您有运行在其他端点上的自托管 Steel 实例，请覆盖此设置。
4. Puppeteer 将通过 wss://connect.steel.dev?sessionId=…&apiKey=… 连接。

示例：

export STEEL_LOCAL="false"

export STEEL_API_KEY="YOUR_STEEL_API_KEY_HERE"

Claude 桌面配置

要使用 Steel Voyager 与 Claude Desktop，请在您的配置文件中添加类似以下内容（通常位于
~/Library/Application Support/Claude/claude_desktop_config.json）：

{
  "mcpServers": {
    "steel-puppeteer": {
      "command": "node",
      "args": ["path/to/steel-puppeteer/dist/index.js"],
      "env": {
        "STEEL_LOCAL": "false",
        "STEEL_API_KEY": "your_api_key_here"
      }
    }
  }
}

根据您所需的模式调整环境变量：

• 如果是本地/自托管运行，保持 "STEEL_LOCAL": "true" 并可选地设置 "STEEL_BASE_URL": "http://localhost:3000".
• 如果是在云模式下运行，移除 "STEEL_LOCAL": "true"，添加 "STEEL_LOCAL": "false"，并提供 "STEEL_API_KEY": "<YourKey>"
这将允许 Claude Desktop 以正确的模式启动 Steel Voyager。

安装与运行

通过 Smithery 安装

要通过 Smithery 自动安装适用于 Claude Desktop 的 Steel MCP Server：

npx -y @smithery/cli install @steel-dev/steel-mcp-server --client claude

本地开发

1. 克隆仓库
2. 安装依赖项：

   npm install
   

3. 构建项目：

   npm run build
   

4. 启动服务器：

   npm start
   

示例用法 📹

我们要求 Claude 展示其新能力，它决定研究 sora 的最新进展，然后创建一个交互式可视化来展示模型背后的数据及其工作原理 🤯

https://github.com/user-attachments/assets/8d4293ea-03fc-459f-ba6b-291f5b017ad7

*抱歉视频质量不佳，GitHub 要求我们将视频大小控制在 10MB 以内 :/

故障排除

常见问题及解决方案：

1. 使用云服务时验证您的 Steel API 密钥，并确保您的本地 Steel 实例正在运行。检查您是否有适当的网络连接到该服务。

2. 如果您遇到页面渲染或标记发送给 Claude 的问题，请尝试通过 GLOBAL_WAIT_SECONDS 环境变量在配置中添加延迟。

3. 确保页面已完全加载，并检查您的视口大小设置。确保您的系统有足够的可用内存来捕获屏幕截图。

4. 当前会话清理不是最佳状态，因此您可能需要手动释放会话，以便它们可以执行任务。

5. 正确提示 Claude 可以大大改善性能并避免它可能产生的愚蠢错误。

6. 利用会话查看器分析您的模型可能在哪一步停止。

7. 在大约 15-20 个浏览器操作后，Claude 开始变慢，因为它的上下文窗口被图像填满。虽然不会太糟糕，但我们注意到这里有一些延迟，特别是 Claude Desktop 客户端滞后。

贡献

此项目处于实验阶段且正在积极开发中。欢迎贡献！

1. 分叉仓库
2. 创建功能分支
3. 提交拉取请求

请包含：

• 清晰的更改描述
• 动机
• 文档更新

免责声明

⚠️ 该项目基于 Web Voyager 代码库进行实验。在生产环境中使用风险自负。