MCP-сервер WebsiteScreenshot.online

Сервер Model Context Protocol, который оборачивает REST API WebsiteScreenshot.online и предоставляет его в виде трёх MCP-инструментов, которые может вызывать любой MCP-совместимый хост (Claude Desktop, Claude Code, Cursor, Cline, Continue, Zed, Raycast, …).

⚡ Большинству пользователей этот пакет не нужен

Если вы просто хотите, чтобы ваш ИИ-ассистент делал скриншоты и записывал видео, используйте размещённую конечную точку — без установки, одна строка JSON:

https://websitescreenshot.online/api/mcp

См. примеры конфигурации для каждого хоста для Claude Code, Claude Desktop, Cursor, Cline, Codex CLI, Gemini CLI, Continue, Windsurf и Zed.

Этот npm-пакет нужен только в том случае, если применимо одно из следующих условий:

• 🛰️ Изолированная или ограниченная сеть — ваш ИИ-хост не может напрямую обращаться к websitescreenshot.online.

• 🏠 Самостоятельно размещённый WebsiteScreenshot — вы запускаете собственный экземпляр, и вам нужен SCREENSHOT_API_BASE, указывающий на него.

• 🔧 Вы хотите провести аудит / изменить сервер — это тот же код, который выполняет размещённая конечная точка, только без обёртки Next.js.

Во всех остальных случаях размещённая конечная точка строго лучше (без зависимости от Node, автоматические обновления, отсутствие нагрузки по обслуживанию).

Related MCP server: MCP Browser Screenshot Server

1. Предварительные требования

• Node.js ≥ 18.18 (рекомендуется LTS)

• Бесплатный или платный аккаунт WebsiteScreenshot.online

• API-ключ WebsiteScreenshot.online (см. § 2)

2. Получение API-ключа

1. Зарегистрируйтесь на https://websitescreenshot.online (GitHub OAuth или email).

2. При необходимости переключите локаль (например, /en/dashboard/api-keys, /zh-CN/dashboard/api-keys).

3. Откройте Dashboard → API Keys → Create new key.

4. Скопируйте ключ. Он начинается с ws_, за которым следуют 64 шестнадцатеричных символа (например, ws_<your-key-here>) и отображается один раз — храните его в безопасном месте.

MCP-сервер читает ключ только из окружения. Он никогда не логируется, никогда не отправляется модели и никогда не записывается на диск этим пакетом.

3. Установка и сборка

git clone https://github.com/Website-Screenshot-Online/websitescreenshot-mcp.git
cd websitescreenshot-mcp
npm install
npm run build

Вот и всё — build/index.js — это автономный исполняемый файл, который можно подключить к любому MCP-хосту.

4. Настройка вашего MCP-хоста

Claude Desktop — claude_desktop_config.json

~/Library/Application Support/Claude/claude_desktop_config.json (macOS) или %APPDATA%/Claude/claude_desktop_config.json (Windows):

{
  "mcpServers": {
    "websitescreenshot": {
      "command": "node",
      "args": ["/absolute/path/to/websitescreenshot-mcp/build/index.js"],
      "env": {
        "SCREENSHOT_API_KEY": "ws_replace_with_your_real_api_key",
        "SCREENSHOT_REQUEST_TIMEOUT_MS": "60000"
      }
    }
  }
}

Claude Code — ~/.claude.json

{
  "mcpServers": {
    "websitescreenshot": {
      "type": "stdio",
      "command": "node",
      "args": ["/absolute/path/to/websitescreenshot-mcp/build/index.js"],
      "env": {
        "SCREENSHOT_API_KEY": "ws_replace_with_your_real_api_key"
      }
    }
  }
}

Cursor / VS Code (.cursor/mcp.json)

{
  "mcpServers": {
    "websitescreenshot": {
      "command": "node",
      "args": ["/absolute/path/to/websitescreenshot-mcp/build/index.js"],
      "env": { "SCREENSHOT_API_KEY": "ws_replace_with_your_real_api_key" }
    }
  }
}

Cline / Continue / Zed / Raycast

Все они принимают одну и ту же форму command + args + env — просто укажите им build/index.js и передайте SCREENSHOT_API_KEY через env.

Перезапустите хост после изменения его конфигурации, и три инструмента появятся в его палитре инструментов.

5. Самостоятельно размещённый WebsiteScreenshot

Если вы запускаете собственный экземпляр WebsiteScreenshot, укажите серверу на него:

"env": {
  "SCREENSHOT_API_KEY": "ws_replace_with_your_real_api_key",
  "SCREENSHOT_API_BASE": "https://your-self-hosted.example.com"
}

6. Примеры использования

Вы не пишете JSON вручную — это делает модель. Ниже приведены полезные нагрузки, которые модель будет фактически отправлять.

Скриншот — область просмотра целевой страницы

take_screenshot({
  url: "https://example.com",
  resolution: { width: 1440, height: 900 },
  format: "png",
  fullSize: false,
  blockAds: true,
  blockCookiesGdpr: true,
  delay: 1
})

Скриншот — полностраничный PDF для архивирования

take_screenshot({
  url: "https://news.ycombinator.com",
  fullSize: true,
  format: "pdf"
})

Синхронное видео (≤ 6 мин)

record_website_video({
  url: "https://stripe.com",
  format: "mp4",
  scrollMode: "smooth",
  smoothScrollSpeed: "normal",
  resolution: { width: 1280, height: 720 }
})

Асинхронное видео + опрос статуса

record_website_video({ url: "https://stripe.com", async: true })
// → { "success": true, "requestId": "f7c1..." }

check_video_status({ requestId: "f7c1..." })
// → { "status": "pending", ... }  // poll again
// → { "status": "completed", "videoUrl": "https://...", ... }

7. Справочник инструментов

take_screenshot

Форма ответа:

{
  "success": true,
  "imageUrl": "https://websitescreenshot.online/screenshots/abc.png",
  "filename": "abc.png"
}

record_website_video

Те же поля, что и выше, плюс:

Синхронный ответ:

{ "success": true, "videoUrl": "https://…/abc.webm", "filename": "abc.webm" }

Асинхронный ответ:

{ "success": true, "requestId": "f7c1…" }

check_video_status

Ответ:

{
  "status": "completed",
  "siteUrl": "https://…",
  "result": { "success": true, "videoUrl": "https://…", "filename": "abc.webm" },
  "updatedAt": 1730000000000
}

status — одно из pending | completed | error. Результаты хранятся в течение 24 часов, затем удаляются.

8. Обработка ошибок

Каждая ошибка API сопоставляется с результатом MCP isError: true, содержащим поля code, status и error. Распространённые коды:

Лимиты: 10 скриншотов / мин и 5 видео / мин на один API-ключ.

9. Переменные окружения

10. Разработка

npm run dev       # tsx, hot reload stdio
npm run lint      # type-check only
npm run build     # emit build/index.js

Чтобы указать dev-серверу на самостоятельно размещённый API:

SCREENSHOT_API_BASE=http://localhost:3000 \
SCREENSHOT_API_KEY=ws_dev_replace_me \
npm run dev

11. Лицензия

MIT © Crownbyte LTD — см. LICENSE.

Веб-сайт: https://websitescreenshot.online Размещённый MCP: https://websitescreenshot.online/api/mcp Документация: https://websitescreenshot.online/en/docs/mcp Поддержка: support@websitescreenshot.online