SDK Web

El SDK Web es compatible con todos los navegadores modernos y ofrece múltiples métodos de integración.

Míralo funcionar en 30 segundos

demo-v1.captcha.la — HTML + PHP puro, licencia MIT, ver el código fuente en cada página.

• popup.html — modo popup
• float.html — widget flotante
• bind.html — enlazar a un botón
• inline.html — integración en línea
• server-token.html — token emitido por el servidor (anti-replay)

Inicio rápido

<!-- 1. Load via CDN (or npm install captchala) -->
<script src="https://cdn.captcha-cdn.net/captchala-loader.js"></script>

<button id="login-btn">Sign in</button>

<script>
loadCaptchala(function () {
  Captchala.init({
    appKey: 'YOUR_APP_KEY',
    product: 'bind',
    action: 'login',
    lang: 'auto',
  })
  .onSuccess(res => sendToBackend(res.token))
  .onError(err => console.error(err.message))
  .bindTo('#login-btn');
});
</script>

Instalación

CDN

<!-- Recommended: auto-fallback loader, ~6 KB gzip -->
<script src="https://cdn.captcha-cdn.net/captchala-loader.js"></script>

NPM

npm install captchala
# or framework wrappers
npm install @captcha-la/vue
npm install @captcha-la/react

import Captchala from 'captchala';
import 'captchala/dist/captchala.css';

Modos

Modo popup

Captchala.init({ appKey: 'YOUR_APP_KEY', product: 'popup', action: 'login' })
  .bindTo('#login-btn')
  .onSuccess(res => sendToBackend(res.token));

Modo flotante

Captchala.init({ appKey: 'YOUR_APP_KEY', product: 'float', action: 'browse' })
  .appendTo('#captcha-container')
  .onSuccess(res => sendToBackend(res.token));

Modo bind

Captchala.init({ appKey: 'YOUR_APP_KEY', product: 'bind', action: 'login' })
  .bindTo('#submit-button')
  .onSuccess(res => submitForm(res.token));   // fires only after challenge passes

Modo embed

Captchala.init({ appKey: 'YOUR_APP_KEY', product: 'embed', action: 'register' })
  .appendTo('#captcha-container')
  .onSuccess(res => sendToBackend(res.token));

Opciones comunes

Parámetro	Tipo	Por defecto	Descripción
appKey	string	—	Application Key (obligatorio)
product	string	popup	Modo de visualización: popup
action	string	default	Escenario de negocio (p. ej. login, register, pay). El servidor aplica diferentes políticas de seguridad según el escenario.
lang	string	auto	Etiqueta BCP-47 (p. ej. en, ja, pt-BR) o auto para seguir navigator.language. Consulta Idiomas soportados — 54 idiomas.
serverToken	string	—	Token de un solo uso (sct_xxx) emitido por tu servidor. Muy recomendado en producción — evita el abuso por refresco ilimitado de desafíos.
onServerTokenExpired	() => Promise<string>	—	Se invoca cuando caduca el serverToken; devuelve uno nuevo para que el SDK pueda continuar sin interrumpir el flujo.
enableVoice	boolean	true	Muestra el acceso al CAPTCHA por audio (soporte de accesibilidad para personas con discapacidad visual).

Validación en el servidor

Tras onSuccess, envía res.token (prefijo pt_) a tu propio backend y luego valídalo en el servidor:

POST https://apiv1.captcha.la/v1/validate
X-App-Key: YOUR_APP_KEY
X-App-Secret: YOUR_APP_SECRET
Content-Type: application/json

{ "pass_token": "<token>", "client_ip": "<end-user IP>" }

Consulta la Referencia de la API para conocer el endpoint completo de validación.