snapapi-mcp

MCP (Model Context Protocol) Server für SnapAPI — Erstellen Sie Screenshots, scrapen Sie Webseiten, extrahieren Sie Inhalte, generieren Sie PDFs, nehmen Sie Videos auf und analysieren Sie Seiten direkt aus KI-Tools wie Claude Desktop, Cursor, Windsurf, Cline und Zed.

Was ist das?

Dieses Paket führt einen lokalen MCP-Server aus, der Ihren KI-Assistenten mit der SnapAPI Web-Capture-API verbindet. Sobald die Konfiguration abgeschlossen ist, kann Ihre KI:

• Screenshots erstellen von jeder URL (ganze Seite, mobil, Dark Mode, Elementauswahl, Geräteemulation)

• Webseiten scrapen und sauberen Text, HTML oder Linklisten mithilfe eines echten Browsers abrufen

• Inhalte extrahieren, die für die LLM-Verarbeitung optimiert sind (Markdown, Artikel, Metadaten, strukturierte Daten)

• PDFs generieren aus URLs oder HTML

• Videos aufnehmen von Browsersitzungen mit optionalen Interaktionsszenarien

• Seiten analysieren mit KI (Extrahieren + Analysieren in einem Aufruf)

• Ihre Nutzung und Kontostatistiken überprüfen

Voraussetzungen

• Node.js 18 oder neuer

• Ein SnapAPI-API-Schlüssel — erhältlich unter app.snapapi.pics

Schnellstart

Claude Desktop

Fügen Sie dies zu ~/Library/Application Support/Claude/claude_desktop_config.json (macOS) oder %APPDATA%\Claude\claude_desktop_config.json (Windows) hinzu:

{
  "mcpServers": {
    "snapapi": {
      "command": "npx",
      "args": ["-y", "snapapi-mcp"],
      "env": {
        "SNAPAPI_API_KEY": "sk_live_your_key_here"
      }
    }
  }
}

Starten Sie Claude Desktop nach dem Speichern neu.

Cursor

Fügen Sie dies zu ~/.cursor/mcp.json hinzu:

{
  "mcpServers": {
    "snapapi": {
      "command": "npx",
      "args": ["-y", "snapapi-mcp"],
      "env": {
        "SNAPAPI_API_KEY": "sk_live_your_key_here"
      }
    }
  }
}

Windsurf

Fügen Sie dies zu ~/.codeium/windsurf/mcp_config.json hinzu:

{
  "mcpServers": {
    "snapapi": {
      "command": "npx",
      "args": ["-y", "snapapi-mcp"],
      "env": {
        "SNAPAPI_API_KEY": "sk_live_your_key_here"
      }
    }
  }
}

Cline (VS Code)

Öffnen Sie die Cline-Einstellungen → MCP Servers → Add Server:

• Command: npx

• Args: -y snapapi-mcp

• Environment: SNAPAPI_API_KEY=sk_live_your_key_here

VS Code (native MCP-Unterstützung)

Fügen Sie dies zu .vscode/mcp.json in Ihrem Arbeitsbereich (oder Ihren Benutzereinstellungen) hinzu:

{
  "servers": {
    "snapapi": {
      "command": "npx",
      "args": ["-y", "snapapi-mcp"],
      "env": {
        "SNAPAPI_API_KEY": "sk_live_your_key_here"
      }
    }
  }
}

Zed

Fügen Sie dies zu ~/.config/zed/settings.json hinzu:

{
  "context_servers": {
    "snapapi": {
      "command": {
        "path": "npx",
        "args": ["-y", "snapapi-mcp"],
        "env": {
          "SNAPAPI_API_KEY": "sk_live_your_key_here"
        }
      }
    }
  }
}

Automatisierter Installer

Führen Sie das enthaltene Hilfsskript aus:

# For Claude Desktop
./install-mcp.sh claude

# For Cursor
./install-mcp.sh cursor

# For Windsurf
./install-mcp.sh windsurf

Verfügbare Tools

ping

Überprüfen Sie, ob SnapAPI erreichbar ist und Ihr API-Schlüssel gültig ist. Keine Parameter erforderlich.

Beispiel-Prompt: "Ping SnapAPI, um zu prüfen, ob es funktioniert"

screenshot

Erstellen Sie einen Screenshot einer beliebigen URL mit umfangreichen Anpassungsmöglichkeiten.

Parameter:

*Mindestens einer der Parameter url, html oder markdown muss angegeben werden.

Beispiel-Prompts:

• "Erstelle einen Screenshot von https://example.com im Dark Mode"

• "Screenshot von https://github.com auf einem iPhone 15 Pro"

• "Erstelle einen Screenshot der gesamten Seite von https://news.ycombinator.com mit blockierten Anzeigen"

• "Rendere dieses HTML als Screenshot: <h1>Hallo</h1>"

scrape

Scrapen Sie Webseiteninhalte mithilfe eines echten Browsers (JavaScript-gerenderte Seiten funktionieren).

Parameter:

Beispiel-Prompts:

• "Scrape den Textinhalt von https://example.com/blog"

• "Hole alle Links von https://news.ycombinator.com"

• "Scrape https://example.com/pricing als HTML"

extract

Extrahieren Sie saubere, strukturierte Inhalte, die für LLMs optimiert sind.

Parameter:

Beispiel-Prompts:

• "Extrahiere den Artikelinhalt von https://example.com/post als Markdown"

• "Hole die Metadaten (Titel, Beschreibung, OG-Bild) von https://example.com"

• "Extrahiere Preis und Bewertung von https://example.com/product"

pdf

Generieren Sie ein PDF aus einer URL oder HTML.

Parameter:

*Mindestens einer der Parameter url oder html muss angegeben werden.

Beispiel-Prompts:

• "Generiere ein PDF von https://example.com/report im A4-Querformat"

• "Konvertiere dieses HTML in ein PDF mit 2cm Rändern"

analyze

Extrahieren Sie Inhalte von einer URL und analysieren Sie diese mit einem KI-Modell in einem einzigen Aufruf.

Parameter:

Beispiel-Prompts:

• "Analysiere https://example.com/article — was sind die Hauptargumente?"

• "Extrahiere alle Produktspezifikationen von https://example.com/product"

• "Was ist die Stimmung dieses Nachrichtenartikels: https://example.com/news"

video

Nehmen Sie eine Browsersitzung als Video (WebM) auf.

Parameter:

Beispiel-Prompts:

• "Nimm ein 10-sekündiges Video von https://example.com auf, während nach unten gescrollt wird"

• "Nimm https://example.com auf einem iPhone 15 Pro auf"

get_usage

Überprüfen Sie Ihr SnapAPI-Kontingent und Ihre monatlichen Statistiken. Keine Parameter erforderlich.

Beispiel-Prompts:

• "Wie viele SnapAPI-Anfragen habe ich diesen Monat noch übrig?"

• "Zeige mir meine SnapAPI-Nutzung"

list_devices

Listen Sie alle verfügbaren Geräte-Presets für Screenshot- und Videoemulation auf. Keine Parameter erforderlich.

Beispiel-Prompt: "Welche Geräte-Presets sind für Screenshots verfügbar?"

Umgebungsvariablen

Entwicklung

# Clone the repo
git clone https://github.com/Sleywill/snapapi-mcp.git
cd snapapi-mcp

# Install dependencies
npm install

# Build
npm run build

# Run locally (reads MCP protocol from stdin)
SNAPAPI_API_KEY=sk_live_your_key node dist/index.js

Fehlerbehebung

"SNAPAPI_API_KEY environment variable is required" Stellen Sie sicher, dass der env-Block in Ihrer MCP-Konfiguration Ihren API-Schlüssel enthält. Prüfen Sie, ob er mit sk_live_ beginnt.

Tools erscheinen nicht in Claude Desktop Starten Sie Claude Desktop nach dem Speichern der Konfiguration neu. Überprüfen Sie die MCP-Protokolle unter:

• macOS: ~/Library/Logs/Claude/mcp*.log

• Windows: %APPDATA%\Claude\logs\mcp*.log

npx dauert beim ersten Ausführen zu lange Verwenden Sie "args": ["-y", "snapapi-mcp"] — das -y-Flag bestätigt die Installationsaufforderung automatisch ohne Interaktion.

screenshot / scrape gibt einen Fehler zurück

• Überprüfen Sie, ob Ihr API-Schlüssel unter app.snapapi.pics/dashboard gültig ist

• Überprüfen Sie Ihr verbleibendes Kontingent mit dem get_usage-Tool

• Versuchen Sie bei JavaScript-lastigen Seiten, "waitUntil": "networkidle" und einen "delay"-Wert hinzuzufügen

analyze-Tool gibt einen Fehler zurück Der Analyse-Endpunkt erfordert Anthropic-API-Guthaben im SnapAPI-Backend. Verwenden Sie das extract-Tool als Fallback, um den Seiteninhalt abzurufen und ihn selbst zu analysieren.

Lizenz

MIT