DEV Community

Erick Eduardo Ramos
Erick Eduardo Ramos

Posted on

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

#debugging #javascript #security #webdev

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

¿Por qué ocurre este error?

Este mensaje aparece cuando Cloudflare (o un proxy similar como AWS WAF, Akamai, etc.) detecta que el navegador del cliente no cumple con los requisitos mínimos de seguridad para acceder al sitio protegido. Específicamente:

  • JavaScript está deshabilitado o bloqueado (por extensiones, configuraciones de seguridad o navegadores antiguos).
  • Las cookies no están habilitadas o no se están aceptando correctamente.
  • El navegador no pasa el JavaScript Challenge de Cloudflare (un mecanismo anti-bot que verifica que el cliente es un navegador real).

⚠️ Importante: Este error no es un bug en tu código front-end. Es una defensa del servidor/proxy contra tráfico no confiable. Pero si tú eres el desarrollador y ves este mensaje mientras desarrollas localmente, entonces sí es un problema de configuración.

Pasos para resolverlo

✅ Caso 1: Estás probando localmente (localhost)

1. Verifica que no estés usando file://

Cloudflare y otros WAF no funcionan con archivos locales (file://). Debes servir tu sitio mediante un servidor HTTP local (ej. http://localhost:3000).

2. Usa un servidor local con HTTPS (recomendado)

Cloudflare requiere HTTPS para muchos desafíos. Configura tu entorno local con HTTPS:

  • En Next.js: next dev --https
  • En Vite: Usa vite --https
  • En Node puro: Usa mkcert + http-server con certificados locales firmados.

3. Desactiva temporalmente Cloudflare (si estás usando su proxy)

Si usas Cloudflare en desarrollo:

  • Ve a la pestaña DNS en tu panel de Cloudflare.
  • Asegúrate de que el registro de tu dominio tenga el ícono nube gris (DNS only), NO naranja (proxied).
  • O usa un dominio sin proxy para desarrollo (ej. dev.tudominio.com sin proxy).

4. Verifica que tu navegador no bloquee cookies o JS

  • Desactiva extensiones como uBlock Origin, Privacy Badger, Ghostery.
  • Asegúrate de que javascript.enabled = true y network.cookie.cookieBehavior = 0 (en about:config de Firefox o Chrome).

✅ Caso 2: El error ocurre en producción (usuarios reales)

1. Verifica que el dominio esté correctamente configurado en Cloudflare

  • Asegúrate de que el registro DNS apunte a Cloudflare y que el proxy esté activo (nube naranja).
  • Confirma que el certificado SSL esté activo (Flexible/Full/Full (Strict)).

2. Ajusta el nivel de protección de Cloudflare

Ve a Security → WAF → Tools y revisa:

  • Browser Integrity Check: Si está en High, baja a Medium o Low.
  • Challenge Passage: Verifica que no estés bloqueando por User-Agent o IP.

3. Asegura que tu app envíe cookies correctamente

Si usas autenticación:

  • Las cookies deben tener SameSite=None y Secure si se usan en subdominios o con HTTPS.
  • Ejemplo en Node.js/Express: 
  res.cookie('token', 'abc123', {
    httpOnly: true,
    secure: true,      // obligatorio para SameSite=None
    sameSite: 'None',
    domain: '.tudominio.com'
  });
Enter fullscreen mode Exit fullscreen mode

4. Verifica que no haya CORS mal configurado

Si el frontend y backend están en dominios distintos:

  • El backend debe enviar Access-Control-Allow-Credentials: true.
  • El frontend debe usar credentials: 'include' en fetch: 
  fetch('/api/login', {
    method: 'POST',
    credentials: 'include',
    body: JSON.stringify({ user, pass }),
    headers: { 'Content-Type': 'application/json' }
  });
Enter fullscreen mode Exit fullscreen mode

Bloque de código corregido (ejemplo mínimo funcional) 

<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="UTF-8">
  <title>App segura</title>
  <script>
    // Asegura que JS esté habilitado (opcional, para UX)
    document.addEventListener('DOMContentLoaded', () => {
      console.log('JavaScript está activo ✅');
    });
  </script>
</head>
<body>
  <div id="app">Cargando...</div>
  <script>
    // Verificación básica de cookies (para depuración)
    if (!document.cookie.includes('session=')) {
      console.warn('⚠️ Cookies no detectadas. Verifica configuración.');
    }
  </script>
</body>
</html>
Enter fullscreen mode Exit fullscreen mode

Pro-tip: Diagnóstico rápido con curl

Ejecuta esto en tu terminal para simular una petición limpia:

curl -v https://tudominio.com 2>&1 | grep -i "challenge\|set-cookie\|javascript"
Enter fullscreen mode Exit fullscreen mode
  • Si ves < set-cookie: cf_clearance=..., Cloudflare está emitiendo el challenge.
  • Si no hay set-cookie, el problema está en la configuración del proxy o certificado.

✅ Solución definitiva: Usa HTTPS en desarrollo, desactiva Cloudflare para entornos locales, y asegura que las cookies se manejen con SameSite=None; Secure en producción.

Top comments (0)