> For the complete documentation index, see [llms.txt](https://developers.oxylabs.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://developers.oxylabs.io/products/es/headless-browser/ai-workflows/integration-with-mcp.md).

# Integración con MCP

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

Esta guía explica cómo integrar [**Oxylabs Headless Browser**](https://oxylabs.io/products/headless-browser) con MCP (Protocolo de contexto de modelos) para permitir que los sistemas de IA interactúen con navegadores remotos y los controlen.

{% hint style="success" %}
Visita el repositorio de GitHub de Oxylabs para ver un ejemplo funcional completo de [**la integración de MCP con Oxylabs Headless Browser**](https://github.com/oxylabs/oxylabs-hb-mcp)**.**
{% endhint %}

## Descripción general

El Protocolo de control de modelos (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 e [**Residential Proxy**](https://oxylabs.io/products/residential-proxy-pool) integración.

El host de MCP (como [**Claude Desktop**](https://claude.ai/download) o [**Cursor**](https://www.cursor.com/)) 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).

<figure><img src="https://2786356907-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FBQ7Zf9paoN3FTeGcyfY1%2Fuploads%2FfmUqkswFOEliXg7wAXdE%2FScreenshot%202026-09-03%20at%2017.44.52.png?alt=media&amp;token=87d150d5-fd2f-4311-89dd-cdfa416d9641" alt=""><figcaption></figcaption></figure>

## 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 Headless Browser desde [**el panel de Oxylabs**](https://dashboard.oxylabs.io/en/registration).
2. **Node.js**: versión `18.0.0` o superior (incluye `npm`/`npx`)

* **Windows**: descarga e instala desde [**nodejs.org**](https://nodejs.org/)
* **macOS**: usa Homebrew (`brew install node`) o descarga desde [**nodejs.org**](https://nodejs.org/)
* **Linux**:
  * Ubuntu/Debian: `sudo apt update && sudo apt install nodejs npm`
  * Fedora: `sudo dnf install nodejs npm`
  * O descarga desde [**nodejs.org**](https://nodejs.org/)

3. **Host de MCP**: 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:

```json
"oxylabs_headless_browser": {
  "command": "npx",
  "args": [
    "@playwright/mcp@latest",
    "--cdp-endpoint",
    "wss://USERNAME:PASSWORD@hb.oxylabs.io"
  ]
}
```

### Opción 1: integración con Cursor

1. Abre Cursor
2. Abre la configuración de Cursor
3. Selecciona MCP
4. Añade 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 Developer
4. Pulsa Edit Config
5. Edita el `claude_desktop_config.json` archivo
6. Añade 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 de navegador añadiendo el `?p_cc` a tu URL de conexión:

```json
"oxylabs_headless_browser": {
  "command": "npx",
  "args": [
    "@playwright/mcp@latest",
    "--cdp-endpoint",
    "wss://USERNAME:PASSWORD@hb.oxylabs.io?p_cc=US"
  ]
}
```

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

{% hint style="success" %}
Puedes encontrar la lista de **códigos de país ISO-3166** [**aquí**](https://en.wikipedia.org/wiki/List_of_ISO_3166_country_codes).
{% endhint %}

También puedes usar `p_state` o `p_city` para segmentación a nivel de estado (US) o ciudad, o usar proxies residenciales persistentes para un control más preciso de la IP de salida. Más información [**aquí**](/products/es/headless-browser/geolocation-and-proxy-selection.md).

## 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 firewalls no bloqueen las conexiones WebSocket
2. **Problemas de rendimiento**:
   * Para usuarios con sede en EE. UU., prueba los endpoints específicos para EE. UU.
   * Aumenta los tiempos de espera 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 de MCP


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://developers.oxylabs.io/products/es/headless-browser/ai-workflows/integration-with-mcp.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
