Steel MCP Server

Стальной MCP-сервер

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

Сервер Model Context Protocol (MCP), который позволяет LLM, таким как Клод, перемещаться по вебу с помощью инструментов на основе Puppeteer и Steel. Основанный на фреймворке Web Voyager, он предоставляет инструменты для всех стандартных веб-действий: щелчков, прокрутки, набора текста и т. д., а также создания снимков экрана.

Попросите Клода помочь вам с такими задачами, как:

• «Найдите рецепт и сохраните список ингредиентов»
• «Отслеживать статус доставки посылки»
• «Найти и сравнить цены на определенный товар»
• «Заполните онлайн-заявку на работу»

🚀 Быстрый старт

Ниже приведено упрощенное руководство по запуску Steel Voyager внутри Claude Desktop. Вам нужно только настроить параметры среды для переключения между Steel Cloud и локальным/самостоятельным экземпляром.

Предпосылки

1. Установлены последние версии Git и Node.js
2. Установлен Claude Desktop
3. (Необязательно) Образ Steel Docker, запущенный локально, если вы планируете размещать его самостоятельно
4. (Необязательно) Если вы используете Steel Cloud, возьмите с собой ключ 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» на ваш действительный ключ API Steel.
   • Убедитесь, что для облачного режима параметр «STEEL_LOCAL» установлен на «false».
3. Запустите Claude Desktop. Он автоматически запустит этот MCP-сервер в облачном режиме.
4. (Необязательно) Вы можете просматривать и управлять активными сеансами Steel Browser на своей панели управления .

B) Быстрый старт (местная/самостоятельная сталь)

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» так, чтобы он указывал на локальный/самостоятельно размещенный URL-адрес Steel.
4. Запустите Claude Desktop, который подключится к локально запущенному Steel и запустит Steel Voyager в локальном режиме.
5. (Необязательно) Для локального просмотра сеансов вы можете посетить собственную панель управления ( localhost:5173 ) или журналы, относящиеся к вашей среде выполнения Steel.

Вот и все! После запуска Claude Desktop будет управлять сервером MCP за кулисами и позволит вам взаимодействовать с возможностями веб-автоматизации через Steel Voyager.

Для получения дополнительной информации о настройке или в случае возникновения проблем ознакомьтесь с документацией по настройке MCP: https://modelcontextprotocol.io/quickstart/user

Компоненты

Инструменты

• навигация
  • Перейдите по любому URL-адресу в браузере.
  • Входные данные:
    • url (строка, обязательно): URL-адрес для перехода (например, « https://example.com »).
• поиск
  • Выполните поиск в Google, перейдя по адресу « https://www.google.com/search?q=encodedQuery ».
  • Входные данные:
    • query (строка, обязательно): Текст для поиска в Google.
• нажмите
  • Щелкните элементы на странице, используя пронумерованные метки.
  • Входные данные:
    • label (номер, обязательно): номер метки элемента, на который нужно нажать.
• тип
  • Введите текст в поля ввода, используя пронумерованные метки.
  • Входные данные:
    • label (номер, обязательно): номер метки поля ввода.
    • text (строка, обязательно): Текст для ввода в поле.
    • replaceText (логическое значение, необязательно): если true, заменяет любой существующий текст в поле.
• прокрутить вниз
  • Прокрутите страницу вниз
  • Входные данные:
    • pixels (целое число, необязательно): Количество пикселей для прокрутки вниз. Если не указано, прокручивает на одну полную страницу.
• прокрутить вверх
  • Прокрутить страницу вверх
  • Входные данные:
    • pixels (целое число, необязательно): Количество пикселей для прокрутки вверх. Если не указано, прокручивает на одну полную страницу.
• возвращаться
  • Перейти на предыдущую страницу в истории браузера
  • Никаких входных данных не требуется.
• ждать
  • Подождите до 10 секунд. Это полезно для страниц, которые загружаются медленно или которым требуется больше времени для отображения динамического контента.
  • Входные данные:
    • seconds (число, обязательно): Количество секунд ожидания (от 0 до 10).
• сохранить_неотмеченный_скриншот
  • Сохраните текущую страницу без ограничивающих рамок или выделений и сохраните ее как ресурс.
  • Входные данные:
    • resourceName (строка, необязательно): Имя для сохранения снимка экрана (например, "before_login"). Если не указано, автоматически генерируется общее имя.

Ресурсы

• Скриншоты : каждый сохраненный снимок экрана доступен через URI ресурса MCP в форме: • screenshot://RESOURCE_NAMEСервер сохраняет эти скриншоты всякий раз, когда вы указываете инструмент "save_unmarked_screenshot" или когда действие завершается (для большинства инструментов) аннотированным скриншотом. Эти изображения можно получить с помощью стандартного запроса на получение ресурсов MCP.

(Примечание: хотя журналы консоли по-прежнему собираются для анализа и отладки, в этой реализации они не отображаются как извлекаемые ресурсы. Они появляются в журналах сервера, но не обслуживаются через URI ресурсов MCP.)

Основные характеристики

• Автоматизация браузера с помощью Puppeteer
• Интеграция Steel для управления сеансом браузера
• Визуальная идентификация элементов с помощью пронумерованных этикеток
• Возможности создания скриншотов
• Базовое веб-взаимодействие (навигация, клики, заполнение форм)
• Поддержка отложенной загрузки посредством прокрутки
• Поддержка локальных и удаленных экземпляров Steel

Понимание ограничивающих рамок

При взаимодействии со страницами Steel Puppeteer добавляет визуальные наложения, помогающие идентифицировать интерактивные элементы:

• Каждый интерактивный элемент (кнопки, ссылки, поля ввода) получает уникальную пронумерованную метку.
• Цветные рамки обозначают границы элементов.
• Метки отображаются над элементами или внутри них для удобства использования.
• Используйте эти номера при указании элементов для операций щелчка или ввода текста.

Конфигурация

Steel Voyager может работать в двух режимах: «Локальный» или «Облачный». Это поведение контролируется переменными окружения. Ниже приведен краткий обзор:

Локальный режим

1. Установите STEEL_LOCAL="true".
2. (Необязательно) Установите STEEL_BASE_URL для указания на сервер Steel, если вы размещаете его на пользовательском домене. В противном случае Steel Voyager по умолчанию будет использовать http://localhost:3000 .
3. В этом режиме ключ API не требуется.
4. Кукловод подключится через ws://0.0.0.0:3000

Пример:

экспорт STEEL_LOCAL="true"

export STEEL_BASE_URL=" http://localhost:3000 " # только при переопределении

Облачный режим

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=…

Пример:

экспорт STEEL_LOCAL="false"

экспорт STEEL_API_KEY="ВАШ_КЛЮЧ_STEEL_API_ЗДЕСЬ"

Конфигурация рабочего стола Клода

Чтобы использовать Steel Voyager с Claude Desktop, добавьте в свой файл конфигурации (часто расположенный по адресу ~/Library/Application Support/Claude/claude_desktop_config.json) что-то вроде этого:

Настройте переменные среды в соответствии с желаемым режимом:

• При локальном/самостоятельном запуске оставьте "STEEL_LOCAL": "true" и, при необходимости "STEEL_BASE_URL": "http://localhost:3000" .
• При работе в облачном режиме удалите "STEEL_LOCAL": "true" , добавьте "STEEL_LOCAL": "false" и укажите "STEEL_API_KEY": "<YourKey>" Это позволит Claude Desktop запустить Steel Voyager в правильном режиме.

Установка и запуск

Установка через Smithery

Чтобы автоматически установить Steel MCP Server для Claude Desktop через Smithery :

Местное развитие

1. Клонировать репозиторий
2. Установить зависимости:
   npm install
3. Создайте проект:
   npm run build
4. Запустите сервер:
   npm start

Пример использования 📹

Мы попросили Клода удивить нас его новыми возможностями, и он решил изучить последние разработки с помощью Sora, а затем создать интерактивную визуализацию, чтобы продемонстрировать данные, лежащие в основе модели, и как она работает 🤯

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

*Извините за качество, github заставляет нас держать видео размером менее 10 МБ :/

Поиск неисправностей

Распространенные проблемы и решения:

1. Проверьте свой ключ API Steel при использовании облачного сервиса и убедитесь, что ваш локальный экземпляр Steel запущен. Проверьте, что у вас есть надлежащее сетевое подключение к сервису.
2. Если у вас возникли проблемы с тем, как страницы отображаются или размечаются и отправляются в claude, попробуйте добавить задержку в конфигурацию с помощью переменной окружения GLOBAL_WAIT_SECONDS .
3. Убедитесь, что страница полностью загрузилась, и проверьте настройки размера области просмотра. Убедитесь, что в вашей системе достаточно памяти для захвата скриншотов.
4. Очистка сеансов на данный момент не является лучшим решением, поэтому вам может потребоваться вручную освобождать сеансы по мере их развертывания для выполнения задач.
5. Правильные подсказки Клоду могут значительно улучшить его работу и избежать возможных глупых ошибок.
6. Используйте средство просмотра сеансов, чтобы проанализировать, где ваша модель может быть остановлена.
7. После ~15-20 действий браузера claude начинает тормозить, так как его контекстное окно заполняется, но с изображениями. Это не должно быть ужасно, но мы заметили некоторую задержку здесь, особенно с отставанием клиента Claude Desktop.

Внося вклад

Этот проект экспериментальный и находится в стадии активной разработки. Вклады приветствуются!

1. Форк репозитория
2. Создать ветку функций
3. Отправить запрос на извлечение

Пожалуйста, включите:

• Четкое описание изменений
• Мотивация
• Обновления документации

Отказ от ответственности

⚠️ Этот проект является экспериментальным и основан на кодовой базе Web Voyager. Используйте в производственных средах на свой страх и риск.