Chrome MCP — Installieren & Live-Demo

Warum nutzen

Hauptfunktionen

Nutzt deinen eingeloggten Chrome — kein OAuth-Tanz, keine Bot-Erkennung
Semantische Suche über alle offenen Tabs
Vollständige DOM-Extraktion + Screenshot-Tools
Funktioniert auf Sites, die Playwright/Puppeteer blockieren
Lokal — keine Cloud-Middleware

Live-Demo

In der Praxis

mcp-chrome.replay ▶ bereit

0/0

Installieren

Wählen Sie Ihren Client

~/Library/Application Support/Claude/claude_desktop_config.json · Windows: %APPDATA%\Claude\claude_desktop_config.json

{
  "mcpServers": {
    "mcp-chrome": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-chrome-bridge"
      ]
    }
  }
}

Öffne Claude Desktop → Settings → Developer → Edit Config. Nach dem Speichern neu starten.

~/.cursor/mcp.json · .cursor/mcp.json

{
  "mcpServers": {
    "mcp-chrome": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-chrome-bridge"
      ]
    }
  }
}

Cursor nutzt das gleiche mcpServers-Schema wie Claude Desktop. Projektkonfiguration schlägt die globale.

VS Code → Cline → MCP Servers → Edit

{
  "mcpServers": {
    "mcp-chrome": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-chrome-bridge"
      ]
    }
  }
}

Klicken Sie auf das MCP-Servers-Symbol in der Cline-Seitenleiste, dann "Edit Configuration".

~/.codeium/windsurf/mcp_config.json

{
  "mcpServers": {
    "mcp-chrome": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-chrome-bridge"
      ]
    }
  }
}

Gleiche Struktur wie Claude Desktop. Windsurf neu starten zum Übernehmen.

~/.continue/config.json

{
  "mcpServers": [
    {
      "name": "mcp-chrome",
      "command": "npx",
      "args": [
        "-y",
        "mcp-chrome-bridge"
      ]
    }
  ]
}

Continue nutzt ein Array von Serverobjekten statt einer Map.

~/.config/zed/settings.json

{
  "context_servers": {
    "mcp-chrome": {
      "command": {
        "path": "npx",
        "args": [
          "-y",
          "mcp-chrome-bridge"
        ]
      }
    }
  }
}

In context_servers hinzufügen. Zed lädt beim Speichern neu.

claude mcp add mcp-chrome -- npx -y mcp-chrome-bridge

Einzeiler. Prüfen mit claude mcp list. Entfernen mit claude mcp remove.

Anwendungsfälle

Praxisnahe Nutzung: Chrome MCP

Recherche auf Login-geschützten Sites — ohne Claude dein Passwort zu geben

👤 Forscher und Analysten mit Abo-Inhalten ⏱ ~20 min beginner

Wann einsetzen: Du bist auf einer Paywall-Site oder einem gesicherten Dashboard eingeloggt und willst, dass Claude es liest.

Voraussetzungen

Chrome-Extension installiert — Aus dem Chrome Web Store installieren; der Bridge-MCP verbindet sich automatisch
Ziel-Site bereits offen und in Chrome authentifiziert — Manuell in einem normalen Tab einloggen

Ablauf

Tabs bestätigen

Liste meine offenen Chrome-Tabs auf.✓ Kopiert

→ Tab-Titel und URLs aller aktiven Tabs
Extrahieren

Extrahiere aus dem Bloomberg-Tab den Artikeltext und die Datentabelle in der Seitenleiste.✓ Kopiert

→ Strukturierter Inhalt abgerufen; kein "Zugriff nicht möglich"-Fehler
Tab-übergreifende Synthese

Was ist der Konsens über X in den 3 Recherche-Provider-Tabs, die ich offen habe?✓ Kopiert

→ Synthese mit Tab-spezifischen Quellenangaben

Ergebnis: Antworten auf Basis echter authentifizierter Inhalte, ohne Login-Seiten zu scrapen.

Fallstricke

Session läuft während der Aufgabe ab — Extension zeigt eine Aktualisierungsaufforderung; in dem Tab neu authentifizieren und wiederholen

Kombinieren mit: memory

UI-Regressionen durch Screenshot-Flows im Dev-Build erkennen

👤 Frontend-Entwickler ⏱ ~30 min intermediate

Wann einsetzen: Du hast gerade ein CSS-Refactoring geliefert und willst einen visuellen Diff für 10 Kernseiten.

Ablauf

Baseline öffnen

Öffne meine Dev-Site-Seiten aus /qa/flows.json und mache jeweils einen Screenshot in /screenshots/before/.✓ Kopiert

→ Screenshots mit Dateinamen entsprechend den URLs gespeichert
Vergleichen

Nach dem Deployment neue Screenshots machen und mit /screenshots/before/ vergleichen. Visuelle Änderungen pro Seite zusammenfassen.✓ Kopiert

→ Seitenweiser Diff-Bericht mit konkreten Beobachtungen

Ergebnis: Ein visueller Regressionsbericht in 5 Minuten, mit deiner echten Browser-Umgebung.

Fallstricke

Screenshots unterscheiden sich durch Font-Ladezeiten — Vor dem Screenshot einen sleep- oder wait_for_selector-Schritt hinzufügen

Kombinieren mit: filesystem

Kombinationen

Mit anderen MCPs für 10-fache Wirkung

mcp-chrome + filesystem

Extrahierte Seiten für spätere Indexierung auf der Festplatte speichern

Diesen Tab extrahieren und in /research/ai-paper-notes.md schreiben.✓ Kopiert

mcp-chrome + memory

Wichtige Erkenntnisse über Browser-Sessions hinweg merken

Was ich heute gelesen habe zusammenfassen und in memory speichern.✓ Kopiert

Werkzeuge

Was dieses MCP bereitstellt

Werkzeug	Eingaben	Wann aufrufen	Kosten
list_tabs	none	Zu Beginn einer Session, um den verfügbaren Kontext zu sehen	free
read_tab	tab_id: int	Inhalt eines bestimmten Tabs laden	free
click	tab_id, selector: str	Mit Seitenelementen interagieren	free
screenshot	tab_id, full_page?: bool	Visueller Capture für Diff oder Review	free
search_tabs	query: str	Herausfinden, welcher Tab X behandelt	free

Kosten & Limits

Was der Betrieb kostet

API-Kontingent: Lokal — unbegrenzt
Tokens pro Aufruf: DOM-Extraktionen können groß sein; 5k–50k Token
Kosten in €: Kostenlos
Tipp: Für read_tab einen Selektor angeben, um die Extraktion einzugrenzen, statt das gesamte DOM zu laden

Sicherheit

Rechte, Secrets, Reichweite

Minimale Scopes: chrome.tabs chrome.scripting

Credential-Speicherung: Keine — Chrome hält die Sessions

Datenabfluss: Tab-Inhalte fließen über den MCP-Client zu deinem LLM-Anbieter

Niemals gewähren: access to incognito without reason

Die Extension hat by design breiten Zugriff — nur aus dem offiziellen Chrome Web Store installieren

Fehlerbehebung

Häufige Fehler und Lösungen

Extension nicht erkannt

Extension anpinnen; das Bridge-Binary benötigt die Extension, die es abfragt

Prüfen: chrome://extensions shows it enabled

Tab-Inhalt ist leer

Seite nutzt möglicherweise Shadow DOM — read_tab mit include_shadow=true versuchen

Klicks werden nicht registriert

Site verwendet Anti-Automatisierung (Cloudflare etc.). Zuerst scrollen, um Lazy-Load auszulösen.

Alternativen

Chrome MCP vs. andere

Alternative	Wann stattdessen	Kompromiss
chrome-devtools MCP	Du willst das Devtools-Protokoll (Konsole, Netzwerk, Performance) statt Nutzer-Automatisierung	DevTools MCP steuert die UI nicht — es untersucht sie
playwright MCP	Du willst Headless-Automatisierung in CI	Kein Auth-Zustand; anfällig für Bot-Erkennung

Mehr

Ressourcen

📖 Offizielle README auf GitHub lesen

🐙 Offene Issues ansehen

🔍 Alle 400+ MCP-Server und Skills durchsuchen