Integración con MCP

Headless Browser se puede usar con MCP, lo que permite a los sistemas de IA controlar navegadores remotos. Obtén más información sobre esta integración.

Esta guía explica cómo integrar Oxylabs Headless Browser con MCP (Protocolo de Contexto del Modelo) para permitir que los sistemas de IA interactúen con y controlen navegadores remotos.

Visita el repositorio de GitHub de Oxylabs para ver un ejemplo completo en funcionamiento de integración de MCP con Oxylabs Headless Browser.

Descripción general

El Protocolo de Contexto del Modelo (MCP) permite que sistemas de IA como Claude interactúen con navegadores y realicen tareas web. Al integrar Oxylabs Headless Browser con MCP, puedes implementar sistemas de IA para realizar navegación web, recuperación de datos y automatización tareas usando navegadores remotos con capacidades avanzadas de navegación autónoma y Residential Proxy integración.

El host MCP (como Claude Desktop o Cursor) viene con un cliente MCP integrado. Playwright-MCP actúa como un servidor MCP, y en lugar de usar un navegador local, se conecta a Headless Browser mediante una conexión WebSocket segura (WSS).

Primeros pasos

Antes de configurar la integración, asegúrate de tener:

1. Cuenta de Oxylabs: obtén tu nombre de usuario y contraseña para Oxylabs Headless Browser.

Por ahora, puedes obtener Headless Browser a través de nuestro equipo de ventas en [e-mail].

1. Node.js: versión 18.0.0 o superior (incluye npm/npx)

• Windows: descarga e instala desde nodejs.org
• macOS: usa Homebrew (brew install node) o descárgalo desde nodejs.org
• Linux:

  • Ubuntu/Debian: sudo apt update && sudo apt install nodejs npm
  • Fedora: sudo dnf install nodejs npm
  • O descárgalo desde nodejs.org

1. Host MCP: ya sea Claude Desktop o Cursor instalado.

Configura el servidor MCP

Crea una sección de configuración del servidor MCP con tus credenciales de Oxylabs. Reemplaza <username> y <password> con tus credenciales reales de Oxylabs:

"oxylabs_headless_browser": {
  "command": "npx",
  "args": [
    "@playwright/mcp@latest",
    "--cdp-endpoint",
    "wss://<username>:<password>@ubs.oxylabs.io"
  ]
}

Opción 1: integración con Cursor

1. Abre Cursor
2. Abre la configuración de Cursor
3. Selecciona MCP
4. Agrega la configuración preparada del servidor MCP
5. Reinicia Cursor

Opción 2: integración con Claude Desktop

1. Abre Claude Desktop
2. Abre la configuración de Claude Desktop
3. Ve a la sección Developer
4. Pulsa Editar configuración
5. Edita el claude_desktop_config.json archivo
6. Agrega la configuración preparada del servidor MCP
7. Reinicia Claude Desktop

Opciones de configuración avanzadas

Selección de país

Puedes especificar un país para tu sesión del navegador añadiendo el ?p_cc parámetro a tu URL de conexión:

"oxylabs_headless_browser": {
  "command": "npx",
  "args": [
    "@playwright/mcp@latest",
    "--cdp-endpoint",
    "wss://<username>:<password>@ubs.oxylabs.io?p_cc=US"
  ]
}

Reemplaza US por el código de país SO-3166 que desees. Si no se especifica ningún país, el sistema asignará uno automáticamente según la disponibilidad.

Puedes encontrar la lista de códigos de país ISO-3166 aquí.

Infraestructura basada en EE. UU.

Para usuarios que operan principalmente en EE. UU., puedes conectarte directamente a infraestructura basada en EE. UU. para obtener tiempos de carga más rápidos:

"oxylabs_headless_browser": {
  "command": "npx",
  "args": [
    "@playwright/mcp@latest",
    "--cdp-endpoint",
    "wss://<username>:<password>@ubs-us.oxylabs.io"
  ]
}

Esta solución acorta principalmente el tiempo de respuesta para usuarios basados en EE. UU. y no debe confundirse con la selección de geolocalización del proxy.

Argumentos del navegador (solo Chrome)

Para Headless Browser basado en Chrome, puedes especificar argumentos adicionales del navegador usando el bargs parámetro:

"oxylabs_headless_browser": {
  "command": "npx",
  "args": [
    "@playwright/mcp@latest",
    "--cdp-endpoint",
    "wss://<username>:<password>@ubc.oxylabs.io/?bargs=force-color-profile:srgb&bargs=window-position:100,100"
  ]
}

Los argumentos compatibles incluyen:

• force-color-profile:<profile>: fuerza que todos los monitores se traten como si tuvieran el perfil de color especificado
• window-position:X,Y: especifica la posición inicial de la ventana
• hide-scrollbars: evita crear barras de desplazamiento para el contenido web
• enable-features:<feature1>,<feature2>,<feature3>: lista separada por comas de nombres de funciones a habilitar
• disable-notifications: deshabilita Web Notification y las APIs Push

Solución de problemas

Si encuentras problemas con la integración:

1. Problemas de conexión:

   • Verifica tus credenciales de Oxylabs
   • Comprueba tu conexión de red
   • Asegúrate de que los cortafuegos no bloqueen las conexiones WebSocket
2. Problemas de rendimiento:

   • Para usuarios basados en EE. UU., prueba los endpoints específicos de EE. UU.
   • Aumenta los timeouts en tu configuración si es necesario
3. El navegador no carga:

   • Comprueba la versión de Node.js (debe ser 18.0.0 o superior)
   • Verifica que npx esté instalado correctamente
   • Reinicia la aplicación host MCP