Erick Eduardo Ramos

Posted on Aug 25

Cómo solucionar el error \"Enable JavaScript and cookies to continue\"

#javascript #security #webscraping

Cómo solucionar el error "Enable JavaScript and cookies to continue"

Este error aparece cuando Cloudflare (o un proxy similar como Brotli/WAF) bloquea la solicitud del cliente porque detecta que JavaScript está deshabilitado o no se ha completado el JavaScript Challenge de verificación de seguridad.

¿Por qué ocurre?

Cloudflare implementa un mecanismo de protección contra bots automatizados. Cuando una solicitud no cumple con ciertos criterios de "humanidad", muestra una página intermedia que requiere:

JavaScript habilitado (para ejecutar un desafío criptográfico en el navegador).
Cookies habilitadas (para persistir el estado de verificación).

Si tu aplicación (frontend o backend) no maneja correctamente este flujo, o si estás haciendo una solicitud directa desde un entorno sin navegador (como curl, axios en Node.js, o un scraper), el desafío no se resuelve, y el servidor sigue respondiendo con esta página de error.

Pasos para solucionarlo

✅ 1. Verifica si estás usando un entorno sin navegador (headless)

Si estás usando:

fetch, axios, curl, requests (Python), etc.
Scripts de automatización sin navegador (scraping sin headless browser)

➡️ No puedes resolver el desafío de Cloudflare directamente. Debes simular un navegador real.

✅ 2. Usa un navegador headless con soporte para JS y cookies

Recomendación profesional: Usa Playwright o Puppeteer con headless: "new" o headless: false.

Ejemplo con Playwright (Node.js):

import { chromium } from 'playwright';

const browser = await chromium.launch({ headless: 'new' });
const context = await browser.newContext({ 
  javaScriptEnabled: true,
  cookies: [] // opcional si ya hay cookies
});
const page = await context.newPage();

// Navega y espera a que se resuelva el desafío
await page.goto('https://tu-sitio.com', { waitUntil: 'networkidle' });

// Opcional: espera explícitamente si hay redirección tras el challenge
await page.waitForSelector('body:not(:has(#challenge-error-text))', { timeout: 10000 });

// Ahora puedes extraer contenido confiable
const content = await page.content();

⚠️ Importante: Cloudflare puede usar browser fingerprinting y behavioral analysis. Asegúrate de usar headless: 'new' (no true) y evitar configuraciones obvias de automatización.

✅ 3. Si eres el dueño del sitio: ajusta las reglas de Cloudflare

Si tú eres el administrador del sitio y estás viendo este error en tu propio sitio:

Ve a Cloudflare Dashboard → Security → WAF → Tools.
Busca la regla "JavaScript Challenge (5s)" o "Browser Integrity Check".
Desactívala temporalmente para pruebas, o:
- Añade una regla de excepción para IPs de confianza (como tu entorno de desarrollo).
- Usa "Under Attack Mode" solo cuando sea estrictamente necesario.

✅ 4. Si usas un proxy inverso (Nginx, etc.), asegura que no interfiera con cookies o headers

Verifica que no estés:

Eliminando Set-Cookie en el proxy.
Modificando el User-Agent de forma sospechosa.
Bloqueando POST o redirecciones en el flujo de challenge.

Bloque de código corregido (Node.js + Playwright)

// ✅ Solución definitiva para scraping o automatización
import { chromium } from 'playwright';

async function bypassCloudflare(url: string) {
  const browser = await chromium.launch({ headless: 'new' });
  const context = await browser.newContext({
    viewport: { width: 1280, height: 720 },
    userAgent: 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36',
    javaScriptEnabled: true,
    permissions: ['geolocation', 'notifications'], // evita prompts que bloquean
  });

  const page = await context.newPage();
  await page.goto(url, { waitUntil: 'domcontentloaded' });

  // Espera activa hasta que desaparezca el error
  try {
    await page.waitForSelector('#challenge-error-text', { state: 'detached', timeout: 15000 });
  } catch (e) {
    // Si no aparece, todo bien
  }

  // Ahora sí, carga el contenido final
  await page.waitForLoadState('networkidle');
  const html = await page.content();

  await browser.close();
  return html;
}

Pro-tip: Detecta si Cloudflare está bloqueando tu petición

Antes de procesar la respuesta, verifica si el HTML contiene el texto del error:

if (html.includes('Enable JavaScript and cookies to continue')) {
  throw new Error('Cloudflare bloqueó la solicitud. Usa un navegador headless.');
}

Esto evita que tu sistema siga procesando una página de error como si fuera contenido válido.

🔑 Clave final: No hay solución "mágica" con headers o User-Agent solo. Si el desafío se activa, solo un navegador real (o simulado con Playwright/Puppeteer) lo resolverá.

DEV Community