[Блог и руководства](https://openscreenshot.app/ru/blog/) · Разработчикам и агентам

# Локальный MCP-сервер для скриншотов для ИИ-агента

Подключите OpenScreenShot к MCP-клиенту по stdio и запрашивайте скриншоты PNG с явными параметрами URL, окна и всей страницы.

Автор: [OpenScreenShot](https://github.com/pghqdev/OpenScreenShot)

OpenScreenShot предоставляет локальный MCP-сервер с одним инструментом: `capture_screenshot`. MCP-клиент может вызвать его с URL веб-страницы и получить изображение PNG. Сервер запускает на вашем компьютере отдельный браузер без интерфейса, совместимый с Chrome; расширение для браузера не требуется.

## Добавьте сервер в MCP-клиент

Сначала установите Node.js, pnpm и браузер, совместимый с Chrome. Добавьте запись сервера в формате настроек вашего клиента. Клиенты, которые принимают объект `mcpServers`, могут использовать:

```
{
  "mcpServers": {
    "openscreenshot": {
      "command": "pnpm",
      "args": ["dlx", "openscreenshot"]
    }
  }
}
```

Клиент должен находить `pnpm` в своём пути поиска исполняемых файлов. После сохранения настроек перезапустите клиент или перезагрузите его MCP-подключения. Сервер работает через stdio, поэтому клиент запускает локальный процесс; размещённого MCP URL, который нужно ввести, нет.

Если Chrome установлен в необычном месте, передайте `CHROME_PATH` через настройки окружения клиента. Укажите полный путь к исполняемому файлу, а не к папке с приложением.

## Вызов capture_screenshot

Минимальные входные данные инструмента:

```
{ "url": "https://example.com" }
```

Так получается снимок окна размером 1280 × 800 по умолчанию. Для воспроизводимого запроса задайте размер окна и параметр всей страницы явно:

```
{
  "url": "https://example.com",
  "fullPage": true,
  "width": 1440,
  "height": 900
}
```

`width` принимает целые числа от 200 до 3840, а `height` — от 200 до 2160. Инструмент возвращает изображение MCP с типом MIME `image/png`. Аргумента для пути вывода у этого инструмента нет. Будет ли результат показан или сохранён, зависит от клиента; если вам сразу нужен файл с именем, используйте [CLI](https://openscreenshot.app/ru/blog/screenshot-cli/).

## Скройте данные до того, как изображение покинет инструмент

Добавьте объект `redact`, чтобы закрыть данные чёрными прямоугольниками на странице до съёмки. Клиент получает только изображение со скрытыми данными:

```
{
  "url": "https://example.com",
  "redact": {
    "selectors": ["#account-menu"],
    "patterns": ["email", "phone", "secret"],
    "rects": [{ "x": 0, "y": 0, "width": 200, "height": 40 }]
  }
}
```

`selectors` закрывает каждый подходящий элемент вместе со всеми его потомками. `patterns` закрывает подходящий текст и значения полей форм: `email`, `phone` (от 9 до 15 цифр) и `secret` (типичные форматы ключей API и токенов, а также длинные хеши). `rects` закрывает прямоугольники в пикселях итогового изображения — для canvas, изображений и iframe с другого источника. Инструмент возвращает ошибку без изображения, если селектор ничего не находит, прямоугольник выходит за пределы изображения или страница сдвигает цель во время съёмки. Шаблоны могут пропустить текст, разбитый на несколько элементов или нарисованный на изображении.

## Что агент видит и чего не видит

Съёмка начинается в новом браузере без интерфейса. Он не наследует cookie или сеанс входа из вашего обычного окна Chrome. Поэтому страница, требующая входа, может дать экран входа. Текущий инструмент не предоставляет шаги входа, подстановку cookie, ожидание селекторов или интерактивные клики.

Прежде чем делать выводы, попросите агента описать, что на самом деле видно на полученном изображении. Скриншот помогает проверить макет, отступы и видимые ошибки; он не может подтвердить, что форма отправляется правильно или что работает навигация с клавиатуры.

## Куда попадает скриншот?

Скриншот создаётся локально и возвращается MCP-клиенту. Если клиент использует размещённую модель, он может передать полученное изображение поставщику модели согласно своим настройкам. Локальная съёмка не означает, что весь разговор с агентом остаётся на устройстве. Используйте `redact` для данных, которые не должны попасть к поставщику.

Для автоматической съёмки с предсказуемыми размерами см. [скриншоты для CI](https://openscreenshot.app/ru/blog/screenshots-for-ci/). [Навык агента для съёмки](https://openscreenshot.app/skills/capture-screenshot.md) и [исходный код сервера](https://github.com/pghqdev/OpenScreenShot/blob/main/mcp/src/serve.ts) содержат инструкции для машин и определение инструмента.

## Что дальше

[Прочитайте документацию](https://openscreenshot.app/ru/docs/), [посмотрите все руководства](https://openscreenshot.app/ru/blog/) или [получите помощь со снимком](https://openscreenshot.app/ru/support/).

---

Canonical page: https://openscreenshot.app/ru/blog/screenshot-mcp-server/