# Utiliser hCaptcha

> Formspree Docs · Paramètres du formulaire et du projet · 18 novembre 2025

Le service de détection de bots [hCaptcha](https://www.hcaptcha.com/) est disponible sur Formspree pour protéger vos formulaires. hCaptcha est une alternative à Google reCAPTCHA axée sur la confidentialité, l'accessibilité et la personnalisation.

Pour commencer, rendez-vous sur le [tableau de bord hCaptcha](https://dashboard.hcaptcha.com/overview). Ajoutez un site (ou utilisez-en un existant), puis ajoutez votre domaine. Des fonctionnalités avancées sont disponibles pour les comptes enterprise, et quelques autres sont gratuites. Configurez selon vos besoins et cliquez sur **Save**.

Une fois créé, vous pouvez voir la liste des sites disponibles et la **clé de site** juste en dessous du nom du site.

![](/images/zendesk/e141bbe37f7f96f1.png)

Copiez la **clé de site**. Elle servira à configurer votre formulaire HTML.

Accédez ensuite à la [page des paramètres de votre compte](https://dashboard.hcaptcha.com/settings/secrets) et copiez votre **secret de compte**. Cette clé servira à configurer votre formulaire dans les paramètres Formspree.

![](/images/zendesk/9274281d3cd60432.png)

Avec la **clé de site** et le **secret** en main, accédez à l'onglet des paramètres de votre formulaire Formspree et assurez-vous que CAPTCHA est activé.

![](/images/zendesk/c3e6f81f162896cb.png)

Cliquez sur **Adjust settings** et collez votre **clé secrète**. Cliquez sur **Save**.

![](/images/zendesk/ddde764d9a199de7.png)

La dernière étape consiste à ajouter **hCaptcha** à votre formulaire HTML. Vous devez coller votre **clé de site** dans un composant div. Dans une configuration de formulaire standard, vous pouvez l'ajouter comme suit :

```html
<html>
  <head>
    <title>hCaptcha Demo</title>
    <script src="https://js.hcaptcha.com/1/api.js" async defer></script>
  </head>
  <body>
    <form action="https://formspree.io/f/{your-form-id}" method="POST">
      <input type="text" name="email" placeholder="Email" />
      <div class="h-captcha" data-sitekey="{your-site-key}"></div>
      <br />
      <input type="submit" value="Submit" />
    </form>
  </body>
</html>
```

Vous pouvez également utiliser AJAX pour soumettre votre formulaire. Consultez l'exemple ci-dessous pour apprendre à soumettre des formulaires avec jQuery en utilisant hCaptcha :

```html
<html>
  <head>
    <title>hCaptcha Demo</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="https://js.hcaptcha.com/1/api.js" async defer></script>
  </head>
  <body>
    <form id="form" method="POST">
      <input type="email" name="email" placeholder="email@example.com" />
      <div class="h-captcha" data-sitekey="{your-site-key}"></div>
      <br/>
      <input type="submit" value="Submit">
    </form>
    <script type="text/javascript">
      $("form").submit(function(e){
      e.preventDefault();
      var hcaptchaVal = $('textarea[name=h-captcha-response]').val();

      $.ajax({
        url: 'https://formspree.io/f/{your-form-id}',
        type: "POST",
        dataType: "json",
        data: {"h-captcha-response": hcaptchaVal, "email": $("input[name='email']").val()},
        success: function(data) {
          console.log(data)
        }
      })
     });
    </script>
  </body>
</html>
```

Si vous développez en local, sachez que [hCaptcha ne peut pas être exécuté sur des applications hébergées sur localhost](https://docs.hcaptcha.com/#local-development) (127.0.0.1). Vous devrez configurer une entrée d'hôte pour contourner cette limitation, ou utiliser un service de tunneling HTTP comme ngrok.
