Captcha invisible

Présentation

Vous pouvez bénéficier de tous les avantages de hCaptcha en matière de blocage des robots sans afficher explicitement notre widget de case à cocher. Les interactions client/serveur hCaptcha se produisent en arrière-plan et l'utilisateur ne se verra présenter un défi hCaptcha que s'il répond aux critères du défi.

Invisible ou passif

hCaptcha prend en charge les modes invisible et passif, et ils peuvent être combinés pour une expérience utilisateur transparente.

• "Invisible" signifie qu'aucune case à cocher n'est utilisée. Par exemple, cliquer sur Soumettre sur un formulaire pour déclencher la génération du jeton hCaptcha peut utiliser le mode « invisible » en définissant cette option comme décrit ci-dessous.

• "Passif" signifie qu'aucun défi visible n'est jamais montré, c'est-à-dire que des mécanismes purement passifs pour la vérification de l'humanité sont utilisés. Ceci est défini via le niveau de difficulté du sitekey.

Entreprise Les utilisateurs peuvent combiner la configuration « Invisible » (sans case à cocher) avec la difficulté « Passive » pour éviter toute interruption de l'utilisateur. Notez cependant le compromis : cela se fait au prix d’une réduction du niveau de protection par rapport à nos modes de défi actif.

Pour les utilisateurs Pro et Enterprise, un mode hybride supplémentaire est disponible :

• Le mode "99,9% Passif" mettra au défi les utilisateurs de manière sélective sur la base d'une évaluation dérivée de milliers de facteurs. Cette approche tente de minimiser les défis lancés à des personnes réelles à moins de 0,1 % des utilisateurs tout en augmentant les coûts d'une attaque dans pratiquement tous les cas.

info

Utilisateurs Enterprise : veuillez consulter la section Comprendre les scores et les modes pour plus de détails sur la configuration des modes passifs et des défis sélectifs.

remarque

Pour vous assurer que vous êtes en conformité avec les lois sur la confidentialité en ligne qui entrent en vigueur dans le monde, veuillez inclure le texte et les liens suivants sur la page qui comprend un hCaptcha invisible :

This site is protected by hCaptcha and its
<a href="https://www.hcaptcha.com/privacy">Privacy Policy</a> and
<a href="https://www.hcaptcha.com/terms">Terms of Service</a> apply.

Vous souhaiterez peut-être également intégrer une divulgation dans votre politique de confidentialité similaire à celle [ici](/faq#do-i-need-to-display-anything-on-the-page-when-using-hcaptcha-in -mode-invisible). Notez qu'il ne s'agit pas d'un avis juridique et que vous devez consulter un avocat dans les juridictions dans lesquelles vous opérez si vous avez d'autres questions sur votre cas d'utilisation spécifique.

Lier automatiquement le défi à un bouton

Le moyen le plus simple de procéder est d'attribuer une classe .h-captcha à n'importe quel button ou input . Comme auparavant, vous devez ajouter votre clé de site dans un attribut data-sitekey attribué à l'élément <button>. De plus, tous les attributs data-* sont applicables ici.

<button class="h-captcha" data-sitekey="your_site_key" data-callback="onSubmit">
Submit
</button>

Comme auparavant, le response-token sera envoyé à la fonction de rappel une fois le défi hCaptcha réussi. Si vous avez attaché le hCaptcha invisible à un bouton de soumission, vous devez spécifier un data-callback pour gérer la soumission du formulaire. Dans la plupart des cas, vous souhaiterez utiliser le rappel pour soumettre manuellement le formulaire.

<script type="text/javascript">
 function onSubmit(token) {
      document.getElementById('my-form').submit();
 }
</script>

Liez le défi par programmation à un bouton ou invoquez le défi

Cela fonctionne sans changement par rapport au rendu explicite du widget hCaptcha décrit ici. La seule différence est que si data-size="invisible" est présent, le widget sera rendu en arrière-plan et présenté uniquement lorsqu'un défi est requis.

Invoquer le défi par programmation

Si vous préférez appeler le workflow hCaptcha via un déclencheur JavaScript (dans des cas comme un clic sur une case à cocher ou un chargement de page), vous devrez utiliser la fonction hcaptcha.execute(widgetID) pour déclencher ce processus sur un moment donné.

Pour plus d'informations sur la fonction hcaptcha.execute et l'argument widgetID , vous pouvez en savoir plus sur la section API JavaScript de la page de configuration

Exemple

Démarrez le processus hCaptcha dans le conteneur div défini, avec le déclencheur onclick sur le bouton

<html>
<head>
<script>
    function onSubmit(token) {
       alert('thanks ' + document.getElementById('field').value);
    }

    function validate(event) {
       event.preventDefault();

       if (!document.getElementById('field').value) {
            alert('You must add text to the required field');
       } else {
            hcaptcha.execute();
       }
    }

    function onLoad() {
       var element = document.getElementById('submit');

       element.onclick = validate;
    }
</script>
<script src="https://js.hcaptcha.com/1/api.js?onload=onLoad" async defer></script>
</head>
<body>

       Name: (required)<input id="field" name="field" />
<div
        id="hcaptcha"
        class="h-captcha"
        data-sitekey="your_site_key"
        data-callback="onSubmit"
        data-size="invisible"
       >
      <button id="submit">submit</button>

</body>
</html>