MCP.so
ログイン

Webpage Screenshot MCP Server

@ananddtyagi

リポジトリ

Webpage Screenshot MCP Server について

An MCP that gives your agent the ability to snap a screenshot of webpages. Useful when you want your agent to check its progress during development.

基本情報

カテゴリ

ブラウザ自動化

ライセンス

MIT

ランタイム

node

トランスポート

stdio

公開者

ananddtyagi

設定

以下の設定を使って、このサーバーを MCP 対応クライアントに追加してください。

{
  "mcpServers": {
    "webpage-screenshot": {
      "command": "node",
      "args": [
        "~/path/to/webpage-screenshot-mcp/dist/index.js"
      ]
    }
  }
}

ツール

ツールは検出されませんでした

ツールは README から自動的に抽出されます。メンテナーは ## Tools という見出しの下に記載することで、このタブに反映できます。

概要

What is Webpage Screenshot MCP Server?

Webpage Screenshot MCP Server is an MCP server that captures screenshots of web pages using Puppeteer. It allows AI agents to visually verify web applications and see their progress when generating web apps.

How to use Webpage Screenshot MCP Server?

Install dependencies with npm install, build with npm run build, then add the server configuration (command node with path to dist/index.js) to Claude Desktop or Cursor settings. Use the provided tools: login-and-wait, screenshot-page, screenshot-element, and clear-auth-cookies.

Key features of Webpage Screenshot MCP Server

  • Full page or viewport screenshots
  • Element-specific screenshots via CSS selectors
  • Supports PNG, JPEG, and WebP formats
  • Base64 encoded image output
  • Manual login with cookie persistence
  • Default browser integration for existing sessions
  • Session persistence for multi-step workflows

Use cases of Webpage Screenshot MCP Server

  • Visually verify a web application during development
  • Take screenshots of protected pages after manual login
  • Capture specific UI elements for testing or documentation
  • Automate multi-step workflows that require authentication
  • Inspect a website’s appearance with your default browser

FAQ from Webpage Screenshot MCP Server

What does this server do?

It provides MCP tools to capture screenshots of web pages (full page, viewport, or specific elements) and return them as base64 encoded images, with support for authentication and session persistence.

How does authentication work?

Use the login-and-wait tool to manually log in through a visible browser window; cookies are saved automatically and reused in subsequent screenshot-page or screenshot-element calls when useSavedAuth is true.

What are the runtime requirements?

Node.js is required. The server uses Puppeteer (bundled Chromium) by default, but can also connect to your system’s default browser (Chrome, Edge, or Safari) with useDefaultBrowser: true.

What is the difference between headless and visible mode?

Headless mode (visibleBrowser: false) is faster for automation; visible mode (visibleBrowser: true) shows the browser window, required for useDefaultBrowser and manual interactions.

Where are authentication cookies stored?

Cookies are saved to the .mcp-screenshot-cookies directory in your home folder. They can be cleared per domain or globally using the clear-auth-cookies tool.

コメント

「ブラウザ自動化」の他のコンテンツ

Playwright MCP Server 🎭

executeautomation

Playwright Model Context Protocol Server - Tool to automate Browsers and APIs in Claude Desktop, Cline, Cursor IDE and More 🔌

5.6K

Playwright Mcp

microsoft

Playwright MCP server

34.8K

Apify Model Context Protocol (MCP) Server

apify

The Apify MCP server enables your AI agents to extract data from social media, search engines, maps, e-commerce sites, or any other website using thousands of ready-made scrapers, crawlers, and automation tools available on the Apify Store.

1.7K

App Store Scraper MCP Server

appreply-co

This is an MCP server that provides tools to LLMs for searching and analyzing apps from both Google Play Store and Apple App Store – perfect for ASO.

60

Puppeteer Vision Mcp Server

djannot

48