Implémentation de reCAPTCHA

Ce guide décrit l'intégration complète de reCAPTCHA v3 sur un formulaire, de la création des clés jusqu'à la vérification côté serveur.

Étape 1 — Créer les clés

Rendez-vous sur la console d'administration : https://www.google.com/recaptcha/admin/create
Connectez-vous avec le compte Google MozArtsduWeb.
Remplissez le formulaire :
- Libellé : le nom du site (ex. agence-nameless.fr) pour vous y retrouver.
- Type de reCAPTCHA : choisissez reCAPTCHA v3.
- Domaines : ajoutez le(s) domaine(s) du site (ex. agence-nameless.fr).
  - Inutile de préciser http:// ou https://, ni le sous-chemin.
  - Ajoutez localhost pendant la phase de développement.
- Acceptez les conditions d'utilisation puis validez.

'Enregistrer un site sur la console reCAPTCHA'

Google vous fournit deux clés :
- Clé de site (site key) → utilisée dans le HTML/JS (publique).
- Clé secrète (secret key) → utilisée côté serveur (à garder confidentielle).

danger

Ne commitez jamais la clé secrète dans le dépôt Git. Stockez-la dans une variable d'environnement ou dans la configuration serveur.

Étape 2 — Charger le script côté front

Ajoutez le script Google dans le <head> (ou juste avant </body>), en remplaçant VOTRE_CLE_DE_SITE.

<script src="https://www.google.com/recaptcha/api.js?render=VOTRE_CLE_DE_SITE"></script>

Étape 3 — Générer et transmettre le token

À la soumission du formulaire, on demande un token à Google puis on l'ajoute dans un champ caché avant d'envoyer les données.

<form id="contact-form" action="/traitement.php" method="POST">
  <!-- vos champs habituels -->
  <input type="text" name="nom" placeholder="Votre nom" required />
  <input type="email" name="email" placeholder="Votre email" required />
  <textarea name="message" placeholder="Votre message" required></textarea>

  <!-- champ caché qui recevra le token -->
  <input type="hidden" name="recaptcha_token" id="recaptcha_token" />

  <button type="submit">Envoyer</button>
</form>

<script>
  const form = document.getElementById("contact-form");

  form.addEventListener("submit", function (e) {
    e.preventDefault();

    grecaptcha.ready(function () {
      grecaptcha
        .execute("VOTRE_CLE_DE_SITE", { action: "submit" })
        .then(function (token) {
          document.getElementById("recaptcha_token").value = token;
          form.submit();
        });
    });
  });
</script>

Étape 4 — Vérifier le token côté serveur

Le serveur envoie le token reçu à l'API Google avec la clé secrète. Google répond avec un success et un score.

<?php
// traitement.php

$secretKey = getenv('RECAPTCHA_SECRET_KEY'); // ne jamais écrire la clé en dur
$token     = $_POST['recaptcha_token'] ?? '';

$response = file_get_contents(
    'https://www.google.com/recaptcha/api/siteverify?' . http_build_query([
        'secret'   => $secretKey,
        'response' => $token,
        'remoteip' => $_SERVER['REMOTE_ADDR'],
    ])
);

$result = json_decode($response, true);

// On accepte si Google valide ET si le score est suffisant (0.5 est un bon seuil de départ)
if (($result['success'] ?? false) === true && ($result['score'] ?? 0) >= 0.5) {
    // ✅ Humain probable : on traite le formulaire (envoi de l'email, enregistrement…)
} else {
    // ❌ Bot probable : on rejette la soumission
    http_response_code(400);
    echo "Échec de la vérification anti-spam.";
    exit;
}

Réponse renvoyée par Google

{
  "success": true,
  "score": 0.9,
  "action": "submit",
  "challenge_ts": "2026-07-15T10:00:00Z",
  "hostname": "agence-nameless.fr"
}

Champ	Description
`success`	`true` si le token est valide (bien formé, non expiré, bon domaine)
`score`	Note de 0.0 (bot) à 1.0 (humain) — spécifique à la v3
`action`	L'action déclarée côté front (`submit` ici)
`hostname`	Le domaine d'où provient la requête

Seuil de score

0.5 est un bon point de départ. Abaissez-le (ex. 0.3) si des utilisateurs légitimes sont bloqués, augmentez-le si trop de spam passe.

Masquer le badge

Google affiche par défaut un badge en bas à droite. Vous pouvez le masquer en CSS à condition d'afficher la mention légale à la place (obligation Google).

.grecaptcha-badge {
    visibility: hidden !important;
}

Ajoutez alors la mention légale près du bouton d'envoi du formulaire :

<p class="recaptcha-notice">
    Ce formulaire est protégé par Google reCAPTCHA. La
    <a href="https://policies.google.com/privacy" target="_blank" rel="noopener noreferrer">Politique de confidentialité</a>
    et les
    <a href="https://policies.google.com/terms" target="_blank" rel="noopener noreferrer">Conditions d'utilisation</a>
    de Google s'appliquent.
</p>

Rendu attendu :

Ce formulaire est protégé par Google reCAPTCHA. La Politique de confidentialité et les Conditions d'utilisation de Google s'appliquent.

warning

Masquer le badge sans afficher cette mention est une violation des conditions d'utilisation de Google. Ne masquez jamais le badge sans ajouter la notice.

Cas WordPress

Sur un site WordPress, l'intégration se fait généralement via l'extension du formulaire. Le plugin gère automatiquement le chargement du script, le token et la vérification serveur : il suffit de renseigner les deux clés (site + secrète) créées à l'étape 1.

Contact Form 7

C'est le cas le plus courant, et le plus simple :

Dans l'administration WordPress, allez dans Contact → Intégration.
Repérez le bloc reCAPTCHA puis cliquez sur Configurer l'intégration.
Collez la clé de site et la clé secrète Google, puis enregistrez.

C'est tout : une fois les clés validées, la mention « reCAPTCHA est activé sur ce site » s'affiche et la protection est active sur l'ensemble des formulaires Contact Form 7 du site.

'Bloc reCAPTCHA dans l’intégration de Contact Form 7'

Autres extensions

WPForms, Gravity Forms, Elementor Forms : rubrique Réglages → reCAPTCHA du plugin, puis coller la clé de site et la clé secrète de la même manière.

Vérification finale

Le formulaire s'envoie normalement pour un utilisateur légitime.
Le token est bien présent dans la requête (recaptcha_token non vide).
Le serveur rejette une soumission sans token valide.
La clé secrète n'apparaît nulle part côté navigateur.
Le badge est visible ou la mention légale est affichée.
Le domaine du site figure bien dans la liste des domaines autorisés de la console.

Ressources

FAQ officielle Google reCAPTCHA (FR)
Console d'administration
Exemple en production : agence-nameless.fr/contact

Étape 1 — Créer les clés​

Étape 2 — Charger le script côté front​

Étape 3 — Générer et transmettre le token​

Étape 4 — Vérifier le token côté serveur​

Réponse renvoyée par Google​

Masquer le badge​

Cas WordPress​

Contact Form 7​

Autres extensions​

Vérification finale​

Ressources​