Chrome MCP — Instalar & Demo en vivo

Por qué usarlo

Características clave

Usa tu Chrome con sesión iniciada — sin flujo OAuth, sin detección de bots
Búsqueda semántica en todas las pestañas abiertas
Extracción completa del DOM y herramientas de captura de pantalla
Funciona en sitios que bloquean Playwright/Puppeteer
Local — sin intermediario en la nube

Demo en vivo

Cómo se ve en la práctica

mcp-chrome.replay ▶ listo

0/0

Instalar

Elige tu cliente

~/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"
      ]
    }
  }
}

Abre Claude Desktop → Settings → Developer → Edit Config. Reinicia después de guardar.

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

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

Cursor usa el mismo esquema mcpServers que Claude Desktop. La configuración del proyecto prevalece sobre la global.

VS Code → Cline → MCP Servers → Edit

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

Haz clic en el icono MCP Servers de la barra lateral de Cline y luego en "Edit Configuration".

~/.codeium/windsurf/mcp_config.json

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

Mismo formato que Claude Desktop. Reinicia Windsurf para aplicar.

~/.continue/config.json

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

Continue usa un array de objetos de servidor en lugar de un mapa.

~/.config/zed/settings.json

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

Añádelo a context_servers. Zed recarga en caliente al guardar.

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

Un solo comando. Verifica con claude mcp list. Quita con claude mcp remove.

Casos de uso

Usos del mundo real: Chrome MCP

Investigar en sitios que requieren login sin entregarle a Claude tu contraseña

👤 Investigadores y analistas que usan contenido de suscripción ⏱ ~20 min beginner

Cuándo usarlo: Tienes sesión iniciada en un sitio de pago o panel protegido y quieres que Claude lo lea.

Requisitos previos

Extensión de Chrome instalada — Instala desde la Chrome Web Store; el MCP puente se conecta automáticamente
Sitio objetivo abierto y autenticado en Chrome — Inicia sesión manualmente en una pestaña normal primero

Flujo

Confirmar pestañas

List my open Chrome tabs.✓ Copiado

→ Títulos y URLs de cada pestaña activa
Extraer

From the Bloomberg tab, extract the article body and the sidebar data table.✓ Copiado

→ Contenido estructurado extraído; sin error «no se puede acceder»
Síntesis entre pestañas

Across the 3 research-provider tabs I have open, what's the consensus view on X?✓ Copiado

→ Síntesis con citas por pestaña

Resultado: Respuestas respaldadas por contenido autenticado real, sin raspar páginas de login.

Errores comunes

La sesión caduca a mitad de la tarea — La extensión muestra un aviso de recarga; vuelve a autenticarte en esa pestaña y reintenta

Combinar con: memory

Detectar regresiones visuales capturando pantallas de flujos en tu build de desarrollo

👤 Ingenieros frontend ⏱ ~30 min intermediate

Cuándo usarlo: Acabas de entregar una refactorización de CSS y quieres una diferencia visual en 10 páginas clave.

Flujo

Abrir línea base

Open my dev site pages listed in /qa/flows.json and screenshot each into /screenshots/before/.✓ Copiado

→ Capturas guardadas con nombres que coinciden con las URLs
Comparar

After I deploy, take fresh screenshots and diff against /screenshots/before/. Summarize visual changes per page.✓ Copiado

→ Informe de diferencias por página con observaciones concretas

Resultado: Un informe de regresión visual en 5 minutos, usando tu entorno de navegador real.

Errores comunes

Las capturas difieren por la carga de fuentes — Añade un paso sleep o wait_for_selector antes de capturar

Combinar con: filesystem

Combinaciones

Combínalo con otros MCPs para multiplicar por 10

mcp-chrome + filesystem

Guardar páginas extraídas en disco para indexación posterior

Extract this tab and write to /research/ai-paper-notes.md.✓ Copiado

mcp-chrome + memory

Recordar hallazgos clave entre sesiones de navegación

Summarize what I read today and store it in memory.✓ Copiado

Herramientas

Lo que expone este MCP

Herramienta	Entradas	Cuándo llamar	Coste
list_tabs	none	Al inicio de cualquier sesión para ver qué hay disponible	free
read_tab	tab_id: int	Obtener contenido de una pestaña específica	free
click	tab_id, selector: str	Interactuar con elementos de la página	free
screenshot	tab_id, full_page?: bool	Captura visual para diferencias o revisión	free
search_tabs	query: str	Encontrar qué pestaña habla sobre X	free

Coste y límites

Lo que cuesta ejecutarlo

Cuota de API: Local — ilimitado
Tokens por llamada: Las extracciones del DOM pueden ser grandes; 5k–50k tokens
Monetario: Gratuito
Consejo: Usa read_tab con un selector para acotar la extracción en lugar de volcar el DOM completo

Seguridad

Permisos, secretos, alcance

Ámbitos mínimos: chrome.tabs chrome.scripting

Almacenamiento de credenciales: Ninguno — Chrome gestiona las sesiones

Salida de datos: El contenido de las pestañas fluye a través del cliente MCP hacia tu proveedor de LLM

No conceder nunca: access to incognito without reason

La extensión tiene acceso amplio por diseño — instala solo desde la lista oficial en la Chrome Web Store

Resolución de problemas

Errores comunes y soluciones

Extensión no detectada

Fija la extensión; el binario puente necesita que la extensión esté sondeando

Verificar: chrome://extensions shows it enabled

El contenido de la pestaña está en blanco

La página puede usar shadow DOM — prueba read_tab con include_shadow=true

Los clics no se registran

El sitio usa protección anti-automatización (Cloudflare, etc). Prueba hacer scroll primero para activar la carga diferida.

Alternativas

Chrome MCP vs otros

Alternativa	Cuándo usarla	Contrapartida
chrome-devtools MCP	Quieres el protocolo devtools (consola, red, rendimiento) no automatización de usuario	El MCP DevTools no controla la UI — la inspecciona
playwright MCP	Quieres automatización sin interfaz gráfica en CI	Sin estado de autenticación; propenso a detección de bots

Más

Recursos

📖 Lee el README oficial en GitHub

🐙 Ver issues abiertas

🔍 Ver todos los 400+ servidores MCP y Skills