Cloudflare Turnstile es una solución ligera y sin CAPTCHA visual para validar formularios y proteger aplicaciones frente a bots. En Nuxt 3 su integración es directa gracias al módulo nuxt-turnstile.
Paso 1 Instalar el módulo
Desde la raíz del proyecto ejecuta en tu terminal
npm install nuxt-turnstile o yarn add nuxt-turnstile
Paso 2 Configuración en Cloudflare
Crea una cuenta gratuita en Cloudflare, entra en la pestaña Turnstile, pulsa en Agregar Widget y configura el widget. Añade el nombre de tu sitio o proyecto, registra el dominio en Agregar nombres de host y guarda. Al finalizar obtendrás dos claves clave de sitio y clave secreta.
Paso 3 Variables de entorno en tu proyecto
Crea el archivo .env si no existe y añade tus claves
TURNSTILE_SITE_KEY=1x00000000000000000000AA
TURNSTILE_SECRET_KEY=0x4XXXXXXXXXXXXXXS_aacaDSD
Paso 4 Configuración en nuxt.config.ts
Añade el módulo @nuxtjs/turnstile y expón en runtimeConfig lo siguiente en el lado privado turnstile.secretKey leyendo de process.env.TURNSTILE_SECRET_KEY y en el lado público public.turnstile.siteKey leyendo de process.env.TURNSTILE_SITE_KEY.
Paso 5 Integración en el cliente
Coloca el componente NuxtTurnstile en el formulario donde quieras validar, por ejemplo en login o registro. Enlázalo con v-model a un ref que almacene el token y, antes de enviar, verifica que el token existe. Puedes ajustar opciones como theme auto size normal action login y language es-ES.
Paso 6 Validación en el backend
En el servidor valida el token recibido desde el frontend contra el endpoint de verificación de Cloudflare enviando secret con tu clave secreta y response con el token. Endpoint de referencia challenges.cloudflare.com/turnstile/v0/siteverify. Valida también el origen y aplica límites de tasa si corresponde.
Buenas prácticas y consejos
1 Carga diferida del widget para mejorar el rendimiento. 2 Rotación de claves ante incidentes. 3 Registra la acción por ejemplo login o contact para mejorar la analítica antifraude. 4 Combina Turnstile con análisis de comportamiento del usuario y límites de peticiones en API.
Cómo puede ayudarte Q2BSTUDIO
En Q2BSTUDIO desarrollamos aplicaciones a medida y software a medida optimizados para rendimiento y seguridad, integrando soluciones modernas como Cloudflare Turnstile, autenticación avanzada y estándares de ciberseguridad. Si estás valorando crear o evolucionar tu plataforma, visita nuestro servicio de desarrollo de software a medida y aplicaciones a medida. También diseñamos arquitecturas elásticas y seguras en la nube con servicios cloud AWS y Azure para maximizar disponibilidad y escalabilidad.
Además, somos especialistas en inteligencia artificial e ia para empresas, implementación de agentes IA, servicios inteligencia de negocio y cuadros de mando con power bi, así como auditorías y pentesting de ciberseguridad. Nuestro enfoque combina estrategia, datos y automatización para generar impacto real en tu negocio.
Palabras clave recomendadas para posicionamiento
aplicaciones a medida, software a medida, inteligencia artificial, ia para empresas, agentes IA, ciberseguridad, pentesting, servicios cloud aws y azure, servicios inteligencia de negocio, power bi
Referencias
Nuxt Turnstile Module y Repositorio del módulo en GitHub