SDK Web

Le SDK Web prend en charge tous les navigateurs modernes avec plusieurs méthodes d'intégration.

Voyez-le fonctionner en 30 secondes

demo-v1.captcha.la — HTML + PHP pur, sous licence MIT, code source consultable sur chaque page.

• popup.html — mode popup
• float.html — widget flottant
• bind.html — lié à un bouton
• inline.html — intégration en ligne
• server-token.html — token émis par le serveur (anti-rejeu)

Démarrage rapide

<!-- 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>

Installation

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';

Modes

Mode popup

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

Mode flottant

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

Mode bind

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

Mode embed

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

Options communes

Paramètre	Type	Valeur par défaut	Description
appKey	string	—	Clé d'application (obligatoire)
product	string	popup	Mode d'affichage : popup
action	string	default	Scène métier (par ex. login, register, pay). Le serveur applique des politiques de sécurité différentes selon la scène.
lang	string	auto	Étiquette BCP-47 (par ex. en, ja, pt-BR) ou auto pour suivre navigator.language. Voir Langues prises en charge — 54 locales.
serverToken	string	—	Token à usage unique (sct_xxx) émis par votre serveur. Fortement recommandé en production — empêche les abus de rafraîchissement illimité du challenge.
onServerTokenExpired	() => Promise<string>	—	Appelé lorsque le serverToken expire ; renvoyez-en un nouveau pour que le SDK puisse continuer sans interrompre le flux.
enableVoice	boolean	true	Affiche le point d'entrée du CAPTCHA audio (prise en charge de l'accessibilité pour les utilisateurs malvoyants).

Validation côté serveur

Après onSuccess, envoyez res.token (préfixe pt_) à votre propre backend, puis validez-le côté serveur :

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>" }

Consultez la Référence de l'API pour l'endpoint de validation complet.