Integración con MCP

Headless Browser puede usarse con MCP, permitiendo a sistemas de IA controlar navegadores remotos. Aprende más sobre esta integración.

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

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

Resumen

Model Control Protocol (MCP) permite que sistemas de IA como Claude interactúen con navegadores y realicen tareas web. Al integrar Oxylabs Headless Browser con MCP, puedes aprovechar sistemas de IA para realizar navegación web, recuperación de datos y automatización tareas usando navegadores remotos con capacidades avanzadas de sigilo y integración Residential Proxy integración.

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

Comenzando

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 [email protected].

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 descarga desde nodejs.org

• Linux:

  • Ubuntu/Debian: sudo apt update && sudo apt install nodejs npm

  • Fedora: sudo dnf install nodejs npm

  • O descarga desde nodejs.org

1. Host MCP: tener instalado Claude Desktop o Cursor.

Configurar el servidor MCP

Crea un bloque 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 del servidor MCP preparada

5. Reinicia Cursor

Opción 2: integración con Claude Desktop

1. Abre Claude Desktop

2. Abre la configuración de Claude Desktop

3. Navega a Developer

4. Pulsa Edit Config

5. Edita el claude_desktop_config.json archivo

6. Agrega la configuración del servidor MCP preparada

7. Reinicia Claude Desktop

Opciones avanzadas de configuración

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 con el código de país SO-3166 deseado. Si no se especifica un país, el sistema asignará uno automáticamente según disponibilidad.

Puedes encontrar la lista de ISO-3166 country codes aquí.

Infraestructura basada en EE. UU.

Para usuarios que operan principalmente en EE. UU., puedes conectarte directamente a la infraestructura basada en EE. UU. para 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 principalmente acorta el tiempo de respuesta para usuarios 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>: Forzar 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 la creación de barras de desplazamiento para contenido web

• enable-features:<feature1>,<feature2>,<feature3>: Lista separada por comas de nombres de funciones para habilitar

• disable-notifications: Desactiva las APIs Web Notification y Push

Solución de problemas

Si encuentras problemas con la integración:

1. Problemas de conexión:

   • Verifica tus credenciales de Oxylabs

   • Revisa tu conexión de red

   • Asegúrate de que los cortafuegos no estén bloqueando las conexiones WebSocket

2. Problemas de rendimiento:

   • Para usuarios 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:

   • Verifica la versión de Node.js (debe ser 18.0.0 o superior)

   • Verifica que npx esté correctamente instalado

   • Reinicia la aplicación host MCP