Noticias
9 min

Cómo usar Firecrawl en Claude Desktop

Configura el servidor MCP de Firecrawl en Claude Desktop y scrapea sitios React y SPAs con JavaScript: ejemplos reales de empleo, caching, stealth mode y solución de problemas.

He pasado los últimos meses construyendo Yubhub (lanzamiento próximamente), un agregador de empleo que alimenta nuestro sitio de empleos de motorsport, fluidjobs.com. El scraper necesita extraer ofertas de empleo de sites de RR.HH. de la Fórmula 1, la ingeniería automotriz y los equipos de carreras. Mercedes F1, FIA, Audi, McLaren: todos sites React con mucho JavaScript con los que los scrapers tradicionales son muy difíciles de configurar para que funcionen.

Las variaciones en estas páginas son amplias: tienen schema, no tienen schema, están hechas en React, están en HTML estático. El scraping de empleos es, en mi opinión, uno de los contenidos más difíciles de scrapear porque la mayoría de páginas son muy poco estructuradas (en su propio perjuicio, añadiría). En fin.

Hoy escribo sobre Firecrawl; es un scraper de contenido sobre Hyperfuel porque, entre bastidores, un LLM lleva la voz cantante. En lugar de pelearse con selectores CSS o, me atrevería a decir, XPath, le indicas al LLM que busque un salario, una descripción del puesto, un título. De repente, las variaciones en la estructura de la página importan menos, y puedes dedicarte a lo tuyo. ¡El scraping de contenido!

La guía de hoy te muestra cómo configurar el servidor MCP de Firecrawl en Claude Desktop y usarlo para trabajo de scraping real. Sin teoría: solo lo que de verdad funciona basado en experiencia en producción.

El problema de scraping que Firecrawl resuelve

Los sites de empleo modernos ya no son HTML simple. A menudo son single-page applications construidas con React, Next.js o Vue. El HTML que descargas con una petición HTTP estándar es solo un esqueleto. JavaScript carga el contenido real después de que la página se renderice en tu navegador. Además, a veces tienen protección contra bots o están construidos de forma que dificultan el scraping (gracias, chicos).

Las herramientas de scraping tradicionales, como requests en BeautifulSoup, descargan HTML en crudo. No pueden ejecutar JavaScript. Cuando las apuntas a un site React, obtienes contenedores <div> vacíos y spinners de «Loading...». Tu navegador ve ofertas de empleo. Tu script no ve nada.

Firecrawl ejecuta un navegador real en la nube. Espera a que JavaScript se ejecute, el contenido se renderice y las imágenes se carguen. Luego extrae la página terminada como markdown o HTML limpio, siguiendo las instrucciones que le hayas pasado a su LLM. Firecrawl es muy listo, por lo que, por supuesto, son algo así como un unicornio en el arena de los VC (algo que me interesa 0: ¡dame las herramientas!). Firecrawl funciona en sites donde las librerías de scraping tradicionales fallan.

Configurar el servidor MCP

Primero necesitas una clave de API de Firecrawl. Ve a firecrawl.dev/app/api-keys y crea una cuenta. El plan gratuito te da 500 peticiones al mes. Suficiente para probar, no para producción.

Para Claude Desktop en Windows 11, necesitas editar tu archivo claude_config.json. Vive en %APPDATA%\Claude\claude_desktop_config.json. Esto está instalado en una implementación estándar de Claude Desktop y, si te sientes valiente, pide a Claude que use Desktop Commander para añadir el servidor MCP de Firecrawl a claude_config.json con la versión NPX.

Añade esta configuración:

{
  "mcpServers": {
    "firecrawl": {
      "command": "npx",
      "args": ["-y", "firecrawl-mcp"],
      "env": {
        "FIRECRAWL_API_KEY": "fc-YOUR_API_KEY_HERE"
      }
    }
  }
}

Sustituye fc-YOUR_API_KEY_HERE por tu clave de API real del dashboard. Guarda el archivo y reinicia Claude Desktop por completo. No vale con cerrar la ventana: sal de la aplicación y vuelve a abrirla.

Consigue tu clave de API aquí: https://www.firecrawl.dev/app/api-keys

Busca el icono del martillo (🔨) en la esquina inferior derecha de la interfaz de Claude. Si lo ves, el servidor MCP se ha cargado correctamente. Haz clic en él para ver las herramientas disponibles. Deberías ver firecrawl_scrape, firecrawl_map, firecrawl_crawl y otras varias.

Si las herramientas no aparecen, revisa tu clave de API. El error más común es copiar la clave incorrectamente o perderse el prefijo fc-. Si actualizas una configuración MCP, reinicia siempre Claude Desktop correctamente: tienes que salir de la app desde la bandeja del sistema, no solo cerrar la ventana.

Pruébalo con una petición sencilla: «¿Puedes scrapear https://firecrawl.dev usando la herramienta firecrawl_scrape?». Si Claude devuelve el contenido markdown de la página principal de Firecrawl, ¡todo funciona!

Ejemplos prácticos

Ejemplo 1: Scrapear sites de empleo cargados de JavaScript

La página de empleos de Mercedes F1 es React puro. Ver el código fuente casi no muestra nada. Firecrawl lo maneja perfectamente.

Pídele a Claude: «Scrapea esta oferta de empleo de Mercedes F1: https://www.mercedesamgf1.com/careers/vacancies/REQ-250454»

Claude hará la llamada:

{
  "name": "firecrawl_scrape",
  "arguments": {
    "url": "https://www.mercedesamgf1.com/careers/vacancies/REQ-250454",
    "formats": ["markdown"],
    "onlyMainContent": true,
    "waitFor": 3000
  }
}

Consejo de desarrollo

El parámetro onlyMainContent elimina navegación, pie, banners de cookies y botones de compartir en redes sociales. Obtienes solo la descripción del puesto. El parámetro waitFor le da a React 3 segundos para renderizar antes de que empiece la extracción.

En el worker del scraper de Yubnub uso formato HTML en lugar de markdown:

const response = await fetch('https://api.firecrawl.dev/v2/scrape', {
  method: 'POST',
  headers: {
    'Authorization': `Bearer ${FIRECRAWL_API_KEY}`,
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({
    url: jobUrl,
    formats: ['html'],
    onlyMainContent: true
  })
});

HTML preserva la estructura semántica (<main>, <article>, <section>) mejor que markdown. En mi flujo, uso un worker de enriquecimiento para limpiar el HTML antes del procesamiento con IA. Para esto, uso la librería htmlparser2. Pero para extracción de contenido simple en Claude Desktop, markdown funciona genial.

Lo bonito de MCP, por supuesto, es que puedes encadenarlos. Mira esta consulta: obtiene las especificaciones de un producto desde esta URL y luego busca alternativas con el Gemini MCP

Ejemplo 2: Mapear un site de empleo

Antes de scrapear empleos individuales, necesitas descubrir qué URLs contienen ofertas. La herramienta firecrawl_map encuentra todas las URLs de un site automáticamente.

Pídele a Claude: «Mapea el site de empleos de la FIA para encontrar todas las URLs de ofertas: https://careers.fia.com/»

Claude hace la llamada:

{
  "name": "firecrawl_map",
  "arguments": {
    "url": "https://careers.fia.com/",
    "includeSubdomains": false,
    "limit": 100
  }
}

Esto devuelve una lista de URLs encontradas en el site. Busca patrones en las URLs de las ofertas. La FIA usa el formato ?page=advertisement_display&id=305. Puedes filtrar los resultados por estos patrones y luego hacer un batch scrape.

El parámetro limit controla cuántas URLs descubre Firecrawl. Súbelo para sites grandes, bájalo para scraping focalizado. El plan gratuito procesa 500 peticiones al mes en total, incluidas las operaciones de mapping y scraping, ¡así que ve con cuidado!

La integración MCP de Claude te permite extraer JSON estructurado de las páginas usando schemas. Es potente para extracción de datos consistente entre páginas similares.

Para scraping de empleos, necesitaba título, empresa, ubicación, descripción y salario de cada oferta. Define la estructura que quieres:

«Extrae la información del empleo de esta página de RR.HH. como JSON: https://jobs.avl.com/job/Sala-Al-Jadida-Verification-&-Validation-Engineer-%28Casablanca%29/1175571601/

Incluye: título del puesto, nombre de la empresa, ubicación, tipo de jornada y una breve descripción.»

Firecrawl estructurará la salida como JSON limpio. El modelo de IA dentro de Firecrawl entiende los patrones de las ofertas de empleo y extrae los campos relevantes automáticamente. Sin lógica de parsing personalizada.

Un gotcha: si pides formato JSON directamente a través de la API (no por Claude MCP), debes proporcionar el campo jsonOptions aunque esté vacío. Me topé con un error 400 Bad Request hasta que añadí "jsonOptions": {} al cuerpo de la petición. Creo que es un poco un gotcha; ¡espero que esta información sea útil!

Funciones que deberías conocer

Caché con maxAge

Firecrawl cachea los resultados por defecto durante 2 días (172.800.000 milisegundos). Esto hace que las peticiones repetidas sean mucho más rápidas y reduce los costes de API en cierta medida. Para contenido que cambia con frecuencia, usa maxAge: 0 para forzar un scraping fresco.

Por la naturaleza de los datos de empleo (o precios, bolsa y demás), voy a necesitar datos frescos. Siempre uso maxAge: 0:

{
  url: jobUrl,
  formats: ['html'],
  onlyMainContent: true,
  maxAge: 0  // Force fresh scrape every time
}

Para contenido estático como documentación, páginas de producto o páginas archivadas, la caché de 2 días por defecto funciona bien. Define maxAge: 600000 para una ventana de 10 minutos si necesitas datos más frescos pero no precisión en tiempo real.

Modo stealth para e-commerce

Algunos sites detectan y bloquean scrapers. Las tiendas Shopify pueden ser especialmente impredecibles. El modo stealth hace que las peticiones de Firecrawl parezcan más de navegador real aleatorizando headers, user agents y patrones de petición.

Actívalo con stealthMode: true en tus opciones de scrape. Añade latencia pero mejora las tasas de éxito en sites protegidos. No lo he necesitado para sites de empleo, pero es esencial para scraping de precios competitivo en plataformas de e-commerce.

Modo rápido frente al por defecto

El modo rápido se salta el renderizado de JavaScript por completo. Úsalo solo para páginas HTML simples donde sabes que el contenido carga de forma estática. Los sites de empleo, las páginas de producto y las aplicaciones web modernas necesitan el modo por defecto con ejecución completa de JavaScript.

Probé el modo rápido en Mercedes F1. Obtuve el HTML esqueleto y nada más. Quédate con el modo por defecto salvo que hagas scraping de blogs estáticos o sites de documentación.

Procesamiento por lotes

El servidor MCP no expone operaciones por lotes directamente, pero puedes encolar múltiples peticiones de scrape a través de Claude. Para uso en producción, la API de Firecrawl soporta batch scraping con una sola llamada:

const batchResult = await fetch('https://api.firecrawl.dev/v2/batch/scrape', {
  method: 'POST',
  headers: {
    'Authorization': `Bearer ${FIRECRAWL_API_KEY}`,
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({
    urls: [
      'https://careers.fia.com/?page=advertisement_display&id=305',
      'https://careers.fia.com/?page=advertisement_display&id=282',
      'https://w-racingteam.com/jobs/detail/57/electrical-technician'
    ],
    formats: ['html'],
    onlyMainContent: true
  })
});

Esto devuelve un ID de job. Haz polling al endpoint de estado para comprobar la finalización. Mucho más eficiente que peticiones individuales para scraping masivo, pero admito que añade complejidad al setup y a la monitorización. He usado batch scrape y me he visto volviendo al endpoint de scrape.

Importante: la herramienta crawl puede devolver cantidades masivas de datos que excedan la ventana de contexto de Claude. Cometí este error al principio: intenté crawl un site de empleo entero y chocaba con los límites de tokens de inmediato. Usa map para descubrir URLs primero y luego haz batch scrape de páginas específicas. Es más lento pero mucho más fiable para sites grandes.

Problemas que me encontré

Problema 1: Timeouts en sites complejos

Algunos sites de empleo tardan 10-15 segundos en renderizarse por completo. El timeout por defecto puede cortar antes de que la extracción termine. Lo vi con un portal de empleo en particular: ¡la búsqueda de empleo de Audi tarda una eternidad en renderizar!

La solución: subir el parámetro waitFor. Uso 3000 ms (3 segundos) mínimo para sites de empleo. Para páginas especialmente pesadas, sube a 5000 ms o incluso 10000 ms.

{
  "url": "https://careers.audi.com/index.html?jobId=8EE9983996021FE0AE96400C821EC8CE",
  "formats": ["markdown"],
  "onlyMainContent": true,
  "waitFor": 5000
}

Mi scraper de producción usa timeouts de 30 segundos en Cloudflare Workers. Los sites de empleo son lentos. Planifica en consecuencia.

Problema 2: Límites de uso

Plan gratuito: 500 peticiones al mes. Plan Hobby: 20.000 peticiones. Parece mucho hasta que empiezas a probar con un feed que tiene 50 empleos.

Choqué con el límite rápido mientras probaba unos cuantos empleos del feed a la vez. Cada llamada de scrape cuenta contra tu cuota. Las operaciones de mapping también cuentan.

Buena práctica: añade delays entre peticiones al probar. Para producción, pasa al plan de pago de inmediato. La cuota adicional de suscripción al mes es despreciable comparada con el tiempo de desarrollo ahorrado.

Problema 3: Extracción de contenido inconsistente

La mayoría de sites de empleo usan layouts no estándar. Firecrawl devolvía HTML, pero no siempre la descripción del puesto. A veces obtenía contenido de la barra lateral o ofertas relacionadas mezcladas.

El parámetro onlyMainContent ayuda, pero no es perfecto. En ocasiones, Firecrawl devuelve páginas vacías o errores de servidor sin motivo evidente. Lo he visto pasar en la misma URL: funciona bien en el primer scrape y no devuelve nada en el segundo. Reintentar suele arreglarlo, pero es algo que hay que contemplar en código de producción. Creo que es un dolor de crecimiento perdonable, dada la relativa novedad de Firecrawl en el trabajo a escala.

Para scraping de producción crítico, valida el contenido extraído. Comprueba los patrones esperados (título del puesto, longitud de la descripción, campos obligatorios). En Yubnub, el worker de enriquecimiento se ocupa de la limpieza: elimina los elementos de navegación y pie que se cuelan antes del procesamiento con IA. También añadí un mecanismo de reintento con un delay de 5 segundos entre intentos.

Problema 4: Formato HTML frente a markdown

Empecé con formato markdown. Parecía más simple. Tuve problemas de inmediato con listas anidadas, tablas y formato que no se parseaba bien para el enriquecimiento con IA.

Cambié a HTML. Mucho mejor. El worker de enriquecimiento puede usar un limpiador de HTML adecuado para eliminar elementos no deseados mientras preserva la estructura semántica. Markdown pierde demasiada información sobre la estructura del documento.

Salvo que estés construyendo salida legible por humanos directamente, usa formato HTML para trabajo de scraping serio. Es más útil desde una perspectiva estructural que markdown (por mucho que todo el mundo parezca amar markdown de repente).

Mis resultados

Antes de Firecrawl, usaba Supadata para scraping de empleo. Fracaso total en sites de empleo modernos (aunque Supadata es excelente para otros casos de uso).

Resultados de Supadata:

  • Longitud del contenido: 50-100 caracteres (fragmentos)
  • Tasa de éxito: 20 % (la mayoría de sites no devolvía nada útil)
  • Tiempo de procesamiento: 2-3 segundos por empleo
  • Resultado: no se pudo construir un scraper de producción

Resultados de Firecrawl:

  • Longitud del contenido: 5.000-10.000 caracteres (descripciones completas)
  • Tasa de éxito: 95 %+ en todos los sites probados
  • Tiempo de procesamiento: 8-12 segundos por empleo
  • Resultado: scraper listo para producción corriendo en Cloudflare Workers

En mi caso, ejecución con Firecrawl. Sites scrapeados con éxito:

  • Mercedes-AMG F1 (React SPA)
  • FIA Careers (cargado de JavaScript)
  • AVL Jobs (carga dinámica)
  • Audi Careers (portal complejo)
  • Xtrac Vacancies (WordPress con JavaScript)
  • W Racing Team (CMS personalizado)

Todos estos fallaban con scraping HTTP tradicional. Firecrawl los manejó sin problemas.

El tiempo de procesamiento es más lento: 8-12 segundos frente a 2-3 segundos con peticiones HTTP simples. Pero la respuesta de 2 segundos de Supadata era contenido inútil. La respuesta de 10 segundos de Firecrawl son datos de producción. El compromiso es obvio.

Qué probar a continuación

Ya tienes Firecrawl corriendo en Claude Desktop. Puedes scrapear sitios web modernos que rompen las herramientas tradicionales. Aquí es por dónde seguir:

  1. Prueba el formato branding: extrae colores, fuentes, espaciado y componentes de UI de los sitios web. Útil para análisis de diseño o investigación competitiva.
  2. Experimenta con acciones: Firecrawl puede hacer clic en botones, rellenar formularios y navegar por sites antes de scrapear. Esencial para contenido protegido por login o flujos multi-paso.
  3. Configura el formato screenshot: devuelve imágenes renderizadas reales de las páginas. Bueno para verificación visual o para archivar cómo se veía una página en un momento dado.
  4. Construye un scraper de producción: usa la API de Firecrawl directamente (no por Claude MCP) para scraping programado y automatizado. Así es como Yubnub corre en producción en Cloudflare Workers.

El servidor MCP es excelente para exploración interactiva y tareas de scraping puntuales. Para sistemas de producción, integra la API de Firecrawl directamente en tu aplicación. Los patrones son los mismos: simplemente controlas tú el timing y el manejo de errores.

Recursos

Firecrawl no es perfecto. Algunos sites siguen bloqueándolo. Los límites de uso llegan antes de lo esperado. La extracción HTML necesita limpieza antes de usarse. Pero resuelve el problema fundamental del renderizado de JavaScript que rompe a los scrapers tradicionales. Para scraping web moderno, es la mejor herramienta que he encontrado.

Artículos relacionados