--- title: "Web Scraping en Cline con el servidor MCP de Bright Data" slug: web-scraping-in-cline-with-bright-data date: 2025-08-24T11:00:03+00:00 modified: 2025-11-04T08:46:49+00:00 permalink: https://brightdata.es/blog/ai/web-scraping-in-cline-with-bright-data type: blog --- [ Blog ](https://brightdata.es/blog "Blog") / [AI](https://brightdata.es/blog/ai) [AI](https://brightdata.es/blog/ai) # Web Scraping en Cline con el servidor MCP de Bright Data Desbloquee las capacidades de web scraping en su agente de codificación Cline AI integrando Bright Data MCP, permitiendo un desarrollo más inteligente y basado en datos en VS Code. 5 min de lectura [ ![Antonello Zanini](https://media.brightdata.es/2022/12/Antonello-Zanini-2-50x50.jpg) ](https://brightdata.com/blog/authors/antonello-zanini) [Antonello Zanini Technical Writer ](https://brightdata.com/blog/authors/antonello-zanini) ![Cline × Bright Data MCP](https://media.brightdata.es/2025/07/Cline%E2%80%AF%C3%97%E2%80%AFBright%E2%80%AFData-MCP.png) En esta entrada de blog, aprenderá: - Qué es Cline y por qué está ganando popularidad en la comunidad de programadores. - Cómo la integración de sus agentes de codificación de IA puede llevar su experiencia de desarrollo al siguiente nivel. - Cómo conectar Cline con el servidor Bright Data MCP para crear agentes de codificación de IA con herramientas de recuperación de datos web. Sumerjámonos. ## ¿Qué es Cline? [Cline](https://cline.bot/) es una extensión de Visual Studio Code que actúa como asistente autónomo de codificación basado en inteligencia artificial. Se integra tanto en la línea de comandos como en el editor de código para ayudarte durante todo el proceso de desarrollo. La extensión Cline VS Code va más allá del completado básico de código. Puede analizar estructuras de proyectos, generar y editar código, ejecutar comandos de terminal e incluso ayudar a depurar aplicaciones web. Cline admite múltiples API de IA, lo que le permite conectarse a diferentes modelos y proveedores. También puede ampliar su funcionalidad añadiendo herramientas personalizadas basadas en IA a través de MCP[(Model Context Protocol](https://www.anthropic.com/news/model-context-protocol)). En el momento de escribir este artículo, la extensión Cline tiene [más de 48.000 estrellas en GitHub](https://github.com/cline/cline) y [más de 1,9 millones de descargas en Visual Studio Marketplace](https://marketplace.visualstudio.com/items?itemName=saoudrizwan.claude-dev). ## ¿Por qué los agentes de Cline deben poder extraer datos de la web? Por muy potente que sea el LLM integrado en Cline, sigue enfrentándose a una limitación común a todos los modelos lingüísticos: los conocimientos obsoletos. Un LLM solo puede responder basándose en los [datos estáticos con los que fue entrenado](/blog/datos-web/llm-training-data), que representan una instantánea del pasado. Dada la rapidez con la que evoluciona el mundo de la tecnología, el problema es aún mayor. Por eso no es raro que los LLM sugieran enfoques de codificación anticuados, métodos obsoletos o que pasen totalmente por alto funciones introducidas recientemente. Ahora imagínese que su asistente de codificación Cline AI puede buscar tutoriales, páginas de documentación y guías actualizadas, y aprender de ellas. Esto es posible integrando Cline con una solución que amplía los LLM con capacidades de búsqueda web y acceso a datos. Eso es exactamente lo que ofrece el [servidor Bright Data MCP](/ai/mcp-server). Este servidor proporciona una colección de más de 60 herramientas preparadas para IA para la recopilación de datos web en tiempo real, impulsadas por [la infraestructura de datos de IA de Bright Data](/ai). Para obtener la lista completa de herramientas expuestas por el servidor MCP de Bright Data Web, [consulte la documentación](https://github.com/brightdata-com/brightdata-mcp/blob/main/assets/Tools.md). Otros posibles casos de uso son: - Recuperación de datos SERP en tiempo real e inserción de enlaces contextuales en sus informes Markdown al utilizar VS Code como editor de texto. - Pedir tutoriales o documentación basada en el código que estás escribiendo activamente. - Extraer datos de sitios reales sobre la marcha y guardarlos localmente para realizar simulaciones o análisis posteriores. Veamos ahora el servidor Bright Data MCP en acción dentro de Cline. Repasaremos uno de los casos de uso anteriores para comprender lo que realmente permite esta integración. ## Cómo añadir capacidades de recuperación de datos a un agente de codificación de IA en Cline Aprenda a añadir Cline a Visual Studio Code e integrarlo con el servidor MCP Bright Data Web. El resultado de esta sección paso a paso será un agente de codificación de IA que puede obtener datos de la web e interactuar con ellos. Esto permitirá al agente ofrecer resultados más precisos y resultados de tareas más inteligentes. En concreto, construirá un agente Cline AI mejorado con capacidades de recuperación de datos y lo utilizará para: 1. Rastrea una página de producto de Amazon. 2. Almacena los datos localmente. 3. Crea un script Node.js para cargar y procesar esos datos. Siga los pasos que se indican a continuación. ### Requisitos previos Para seguir este tutorial, necesitas - Node.js instalado localmente (recomendamos la [última versión LTS](https://nodejs.org/en/download)) - Un [relato de Cline](https://app.cline.bot/) - Una [clave API de Bright Data](https://docs.brightdata.com/api-reference/authentication#generating-an-api-key%3A) - (Opcional) Una clave API para su LLM preferido (como [la clave API de Google Gemini](https://ai.google.dev/gemini-api/docs/api-key)) No se preocupe si aún no tiene una clave API de Bright Data o una cuenta de Cline. Le guiaremos para configurarlas en los siguientes pasos. ### Paso 1: Instalar Cline en Visual Studio Code Abra Visual Studio Code, haga clic en el icono Extensiones de la barra lateral izquierda, busque “cline” y seleccione la [extensión Cline](https://marketplace.visualstudio.com/items?itemName=saoudrizwan.claude-dev) de la lista. En la pestaña de la extensión Cline, haz clic en el botón “Instalar”: ![Haga clic en el botón "Instalar" para instalar Cline en VS Code](https://media.brightdata.com/2025/07/Clicking-the-Install-button-to-install-Cline-in-VS-Code-1-1024x608.png)Si es la primera vez que instala una extensión de Cline, se le pedirá que confíe en el editor. Haga clic en “Confiar en el editor e instalar” para continuar: ![](https://media.brightdata.com/2025/07/image-116-1024x608.png)Una vez instalado, debería ver un icono de Cline en la barra lateral izquierda. Haz clic en él para abrir el panel de Cline: ![Cline activado en VS Code](https://media.brightdata.com/2025/07/image-117-1024x608.png)**Nota**: Si el icono de Cline no aparece, intente recargar Visual Studio Code. Para cualquier otro problema, consulte la [página oficial de documentación de la instalación](https://docs.cline.bot/getting-started/installing-cline). ¡Maravilloso! Cline se ha instalado en VS Code. ### Paso 2: Configurar la conexión Cline Ahora debe conectar su cuenta de Cline a la extensión previamente instalada. Para ello, haga clic en el botón “Empezar gratis”: ![Pulsar el botón "Empezar gratis](https://media.brightdata.com/2025/07/image-118-462x1024.png)Será redirigido a la siguiente página en su navegador: ![Página de inicio de sesión / creación de cuenta de Cline](https://media.brightdata.com/2025/07/The-Cline-login-and-account-creation-page-1-1024x547.png)Regístrate (o inicia sesión si ya tienes una cuenta), y serás redirigido de nuevo a la ventana de VS Code: ![Página de redirección de Cline a VS Code](https://media.brightdata.com/2025/07/image-119-1024x547.png)En Visual Studio Code, ahora debería ver el siguiente modal. Haga clic en “Abrir” para autenticar la extensión Cline: ![Hacer clic en "Abrir" para autentificar la extensión Cline](https://media.brightdata.com/2025/07/image-120-1024x461.png)La extensión Cline debería tener ahora este aspecto: ![El panel de ampliación de Cline en VS Code](https://media.brightdata.com/2025/07/image-121-417x1024.png)Si vuelves a tu cuenta de Cline en el navegador, verás que viene con 0,50 $ en créditos gratuitos por defecto: ![El crédito por defecto ofrecido por Cline](https://media.brightdata.com/2025/07/image-122-1024x544.png)Si tiene previsto utilizar LLM premium a través de Cline, considere la posibilidad de añadir créditos. (El motivo es que el saldo por defecto solo permite realizar pruebas limitadas). Alternativamente, si quieres evitar gastar dinero o prefieres usar tu propio proveedor de LLM, puedes conectar tu clave API directamente. Para ello, haz clic en el icono de engranaje del panel de Cline. A continuación, selecciona “Configuración API” y pega tu clave API para configurar tu integración LLM: ![Configurar su propio LLM en Cline](https://media.brightdata.com/2025/07/image-123-660x1024.png)En el ejemplo anterior, hemos integrado Cline con [el modelo`gemini-2.5-flash`](https://cloud.google.com/vertex-ai/generative-ai/docs/models/gemini/2-5-flash), de uso gratuito a través de la API. ¡Impresionante! Cline está ahora totalmente configurado en VS Code y listo para ayudarle a construir un agente de codificación AI con capacidades de raspado web. ### Paso nº 3: Instalar el servidor MCP de Bright Data Si aún no lo ha hecho, [cree una cuenta de Bright Data](/?hs_signup=1). Si ya tiene una, simplemente inicie sesión. A continuación, [siga las instrucciones oficiales](https://docs.brightdata.com/api-reference/authentication#generating-an-api-key%3A) para recuperar su Bright Data API. Para simplificar, en las instrucciones siguientes se asume que está utilizando un token de API con permisos de administrador. Ahora puede instalar el [servidor MCP Web de Bright Data](https://github.com/brightdata/brightdata-mcp) de forma global en su entorno Node.js mediante: ```none npm install -g @brightdata/mcp ``` A continuación, comprueba que todo funciona con el siguiente comando Bash: ```none API_TOKEN="" npx -y @brightdata/mcp ``` O, en Windows, el comando PowerShell equivalente es: ```none $env:API_TOKEN=""; npx -y @brightdata/mcp ``` En el comando anterior, sustituya el marcador de posición `` por la API real de Bright Data que recuperó anteriormente. Este comando establece la variable de entorno `API_TOKEN` necesaria e inicia el servidor MCP utilizando el paquete [`@brightdata/mcp`](https://www.npmjs.com/package/@brightdata/mcp) npm. Si todo está configurado correctamente, tu terminal debería mostrar algo como esto: ![Registros de inicio del servidor Bright Data MCP](https://media.brightdata.com/2025/07/image-124-1024x157.png)Como puede ver, la primera vez que ejecuta el comando, el paquete `@brightdata/mcp` inicializa las zonas de Bright Data necesarias en su cuenta. Más concretamente, crea una zona para [Web Unlocker](/products/web-unlocker) y otra para [Scraping Browser API](/products/scraping-browser). Estas dos zonas permiten al servidor MCP ejecutar todas las herramientas que expone. Para comprobarlo, inicie sesión en su panel de Bright Data y vaya a la página[“Proxies & Scraping Infrastructure](/cp/zones)“. Verá que se han creado automáticamente las siguientes zonas: ![Nuevas zonas creadas en el cuadro de mandos de Bright Data](https://media.brightdata.com/2025/07/image-125-1024x539.png)**Nota**: Si no utiliza un token de API con permisos de administrador, deberá crear las zonas manualmente. Consulte la [documentación oficial para obtener información detallada](https://github.com/brightdata/brightdata-mcp?tab=readme-ov-file#-account-setup). ¡Fantástico! El servidor MCP de Bright Data Web funciona a las mil maravillas. ### Paso 4: Conectar Cline al servidor MCP de Bright Data Ha llegado el momento de integrar la extensión de Cline con el servidor MCP de Bright Data Web que se ejecuta localmente. Comience haciendo clic en el botón “Servidores MCP” del panel de Cline: ![Pinchando en "Servidores MCP" en el menú superior derecho de Cline](https://media.brightdata.com/2025/07/image-126.png)Accederás a la sección de configuración de los Servidores MCP de Cline. Cambia a la pestaña “Instalado” y haz clic en el botón “Configurar servidores MCP”: ![Haciendo clic en el botón "Configurar servidores MCP](https://media.brightdata.com/2025/07/image-127.png)Se abrirá un archivo `cline_mcp_setting.json` en Visual Studio Code. En él puede definir a qué servidores MCP puede conectarse la extensión de Cline. Para la integración con el servidor MCP de Bright Data Web, configúrelo del siguiente modo: ```none { "mcpServers": { "Bright Data": { "autoApprove": [], "disabled": false, "timeout": 300, "type": "stdio", "command": "npx", "args": [ "@brightdata/mcp" ], "env": { "API_TOKEN": "" } } } } ``` **Nota**: Para más detalles, [consulte la edición oficial de GitHub](https://github.com/cline/mcp-marketplace/issues/263). En otras palabras, añada la configuración “Bright Data” dentro del campo `mcpServers`. Asegúrese de sustituir `` por su token de API de Bright Data real. Deberías ver algo como esto: ![El código JSON para la conexión al servidor MCP](https://media.brightdata.com/2025/07/image-128-1024x451.png)Perfecto. Ahora, si entra en la pestaña “Instalado”, verá una entrada para el servidor Bright Data MCP. Despliéguela para ver todas las herramientas que soporta: ![El servidor MCP de Bright Data Web conectado](https://media.brightdata.com/2025/07/image-129-715x1024.png)Aquí puede configurar el servidor Bright Data MCP y sus herramientas. Para este flujo de trabajo, la configuración predeterminada está bien. Para más información, [consulta la documentación oficial](https://docs.brightdata.com/api-reference/MCP-Server). ¡Genial! La extensión Cline ya puede conectarse al servidor MCP de Bright Data Web y utilizar sus herramientas. ### Paso 5: Utilizar el agente Cline AI Ya está listo para probar el agente de codificación de Cline AI conectado al servidor MCP de Bright Data Web en Visual Studio Code. Empiece por abrir Cline. A continuación, haga clic en la flecha de la derecha para acceder al menú “Configuración de aprobación automática”. En el menú, marque la opción “Usar servidores MCP” para permitir la conexión automática a los servidores MCP configurados: ![Activar el uso del servidor MCP en la configuración](https://media.brightdata.com/2025/07/image-130-725x1024.png)Con esta opción activada, Cline se conectará automáticamente al servidor MCP sin pedir permiso. Aún así, se le preguntará antes de utilizar una herramienta, por lo que debería ser suficiente. Pruebe las capacidades de acceso a datos en su agente de codificación de IA con una solicitud como ésta: ```none Scrape data from "https://www.amazon.com/PlayStation%C2%AE5-console-slim-PlayStation-5/dp/B0CL61F39H/", save it to a local data.json file, and create a Node.js index.js script to load and print its contents. ``` Esto describe un escenario potencial del mundo real, que resulta útil para recopilar datos para análisis, simulaciones o pruebas. Ejecute el prompt en Cline, y debería ver la siguiente interacción: ![La interacción que se supone que debe ver](https://media.brightdata.com/2025/07/image-131-1024x607.png)El GIF anterior se ha acelerado, pero esto es lo que ocurrió: 1. La extensión Cline envía el mensaje a su LLM configurado (por ejemplo, `gemini-2.5-flash`). 2. El LLM identifica la herramienta MCP adecuada para el trabajo, que es [`web_data_amazon_product`](https://github.com/brightdata/brightdata-mcp/blob/main/assets/Tools.md). 3. Le pide permiso para ejecutar esa herramienta a través de Bright Data MCP, utilizando la URL del producto Amazon desde el prompt (es decir, `https://www.amazon.com/PlayStation%C2%AE5-console-slim-PlayStation-5/dp/B0CL61F39H/)` 4. Una vez aprobada, la tarea de scraping se lanza en los servidores de Bright Data. 5. A continuación, Cline pide permiso para acceder al resultado de la tarea. 6. Entre bastidores, Bright Data realiza la tarea de scraping, y Cline recibe los datos reales del producto en formato JSON. Esa es la salida de la herramienta MCP, que muestra Cline. 7. Se le pide permiso para guardar los datos en un archivo `data.json`. 8. Una vez aprobado, el expediente se crea y se rellena. 9. Se le pedirá que cree un script `index.js` para leer e imprimir el contenido JSON. 10. Una vez aprobado, se genera el expediente. Una vez completada la tarea, su proyecto contendrá estos dos archivos: ![Los archivos en tu carpeta después de que Cline termine la tarea](https://media.brightdata.com/2025/07/image-132.png)Donde `data.json` almacena los datos de productos de Amazon en formato JSON recuperados por [Amazon Scraper de Bright Data](/products/web-scraper/amazon): ![Los datos de la página de Amazon](https://media.brightdata.com/2025/07/image-133-1024x584.png)Un `index.js`: contiene lógica Node.js para cargar e imprimir su contenido: ![](https://media.brightdata.com/2025/07/image-134-1024x584.png)Ejecute el script `index.js` producido con: ```none node index.js ``` En el terminal, debería ver impresos los datos del producto: ![](https://media.brightdata.com/2025/07/image-135-1024x433.png)Los flujos de trabajo funcionaron perfectamente, ya que los datos contenidos en el archivo JSON coinciden con los datos de la página de producto original de Amazon: ![](https://media.brightdata.com/2025/07/image-136-1024x549.png)Ten en cuenta que `data.json` almacena datos raspados reales, no contenido alucinado del LLM. Además, recuerda que raspar Amazon no es poca cosa, dados sus estrictos sistemas anti-bot (como el famoso [Amazon CAPTCHA](/blog/datos-web/bypass-amazon-captcha)). Ese es el poder de Bright Data + Cline, y el anterior era sólo un caso de uso básico. Ahora puede probar más indicaciones y explorar [flujos de trabajo de datos avanzados basados en LLM](/ai/web-access), directamente desde Visual Studio Code. ¡Et voilà! Acaba de presenciar una recuperación de datos web sin fisuras utilizando la integración MCP de Bright Data con el agente de codificación Cline AI. ## Conclusión En este artículo, aprendió a integrar Cline con el servidor MCP de Bright Data Web para construir un agente de codificación de IA que puede acceder a la web. Esto fue posible gracias al soporte de Cline para la integración MCP. Tenga en cuenta que esto es sólo un ejemplo sencillo. Para crear agentes más avanzados, considere explorar toda la gama de herramientas disponibles en el [servidor MCP de Bright Data Web](/ai/mcp-server). Estas herramientas pueden dar soporte a la mayoría de sus casos de uso de datos basados en IA. Cree una cuenta gratuita en Bright Data y empiece a explorar nuestras herramientas de datos web preparadas para la IA. Contactar ventasPrueba gratuita![google social icon](/wp-content/themes/brightdata/assets/images/ic_google.svg) Tabla de Contenidos Data for AI Supercharge your AI with instant and reliable access to web data. No blockers. No hassle. Talk to an expert Bright Data MCP Get started with Bright Data’s Web MCP Server today with 5000 free monthly requests and unlock your AI’s full potential. Start free now [ ](https://news.ycombinator.com/submitlink?t=Web+Scraping+en+Cline+con+el+servidor+MCP+de+Bright+Data&u=https://brightdata.es/blog/ai/web-scraping-in-cline-with-bright-data) [ ](https://www.linkedin.com/shareArticle?mini=true&title=Web+Scraping+en+Cline+con+el+servidor+MCP+de+Bright+Data&url=https://brightdata.es/blog/ai/web-scraping-in-cline-with-bright-data) [ ](http://www.reddit.com/submit?title=Web+Scraping+en+Cline+con+el+servidor+MCP+de+Bright+Data&url=https://brightdata.es/blog/ai/web-scraping-in-cline-with-bright-data) ## Usted también puede estar interesado en [ ![OpenHuman with Bright Data](https://media.brightdata.es/2026/09/OpenHuman-with-Bright-Data.png) ](https://brightdata.es/blog/ai/openhuman-with-bright-data "Acceso Web Listo para Producción en OpenHuman a Través de la CLI de Bright Data") [AI ![Antonello Zanini](https://media.brightdata.es/2022/12/Antonello-Zanini-2-50x50.jpg) Antonello Zanini Technical Writer ### Acceso Web Listo para Producción en OpenHuman a Través de la CLI de Bright Data Integra la CLI de Bright Data con OpenHuman para habilitar acceso web listo para producción y recopilación de datos para agentes de IA. 09-Sep-2026 14 min de lectura ](https://brightdata.es/blog/ai/openhuman-with-bright-data) [ ![Multimodal Web Scraping with MiniMax](https://media.brightdata.es/2026/09/Multimodal-Web-Scraping-with-MiniMax.png) ](https://brightdata.es/blog/datos-web/multimodal-web-scraping-with-minimax "Scraping Web Multimodal con MiniMax") [Datos web ![Antonello Zanini](https://media.brightdata.es/2022/12/Antonello-Zanini-2-50x50.jpg) Antonello Zanini Technical Writer ### Scraping Web Multimodal con MiniMax Combina Bright Data Web Unlocker con la visión de MiniMax M3 para extraer datos estructurados de imágenes y capturas de pantalla de páginas web. 09-Sep-2026 5 min de lectura ](https://brightdata.es/blog/datos-web/multimodal-web-scraping-with-minimax) [ ![The 10 Best CLI Tools for Codex in 2026](https://media.brightdata.es/2026/08/The-10-Best-CLI-Tools-for-Codex-in-2026.png) ](https://brightdata.es/blog/ai/best-cli-tools-for-codex "Las 10 mejores herramientas CLI para Codex en 2026 – Probadas y clasificadas") [AI ![Daniel Shashko](https://media.brightdata.es/2022/04/Daniel-Shashko-2-50x50.png) Daniel Shashko Web Data & AI Expert ### Las 10 mejores herramientas CLI para Codex en 2026 – Probadas y clasificadas Las 10 herramientas CLI que hacen a Codex más rápido y capaz, comenzando con la Bright Data CLI para acceso web real desde dentro del sandbox. 06-Sep-2026 24 min de lectura ](https://brightdata.es/blog/ai/best-cli-tools-for-codex)