Exemples d'intégration avec Google Cloud Armor

Ce document présente des exemples d'implémentation des fonctionnalités reCAPTCHA pour WAF pour Google Cloud Armor.

Vous pouvez utiliser une ou plusieurs fonctionnalités de reCAPTCHA pour WAF dans une seule application.

Si vous souhaitez utiliser plusieurs fonctionnalités, vous devez créer une clé reCAPTCHA. pour chacune de ces fonctionnalités et les utiliser dans votre application. Par exemple, si vous si vous souhaitez utiliser des jetons d'action reCAPTCHA et une page de test reCAPTCHA, vous devez créer une clé de jeton d'action et une clé de page de test, et les utiliser dans votre application.

Exemple 1 : Utiliser la page de test reCAPTCHA et les jetons de session reCAPTCHA

Vous pouvez ajouter un jeton de session reCAPTCHA sur les pages auxquelles un utilisateur peut accéder afin que le cookie soit actualisé régulièrement, par exemple une page de connexion. Configurer une règle de stratégie de sécurité Google Cloud Armor vers laquelle rediriger la requête une page de test reCAPTCHA lorsque le score est faible.

L'illustration suivante montre un workflow qui utilise les fonctionnalités de page de test reCAPTCHA et de jeton de session reCAPTCHA :

Exemple 2 : Utiliser la page de test reCAPTCHA et les jetons d'action reCAPTCHA

Vous pouvez ajouter un jeton d'action reCAPTCHA pour protéger une action utilisateur, telle qu'un règlement. Configurez une règle de stratégie de sécurité Google Cloud Armor pour rediriger la requête vers une page de test reCAPTCHA selon l'une des conditions suivantes :

  • Le score est faible.
  • L'attribut action_name du jeton d'action ne correspond pas à l'action utilisateur protégée.

L'illustration suivante montre un workflow qui utilise les fonctionnalités de page de test reCAPTCHA et de jeton d'action reCAPTCHA :

L'exemple de script suivant montre comment utiliser un jeton d'action reCAPTCHA et rediriger vers une page de test reCAPTCHA avec le jeton d'action joint en tant qu'en-tête:

   <script src="https://www.google.com/recaptcha/enterprise.js?render=ACTION_TOKEN_SITE_KEY"></script>
    <script>
     function onSuccess(token) {
       const xhr = new XMLHttpRequest();
       xhr.open('GET','http://www.example.com/checkout', false);
       xhr.setRequestHeader("X-Recaptcha-Token", token);
       xhr.onreadystatechange = function() {
         // Make sure that the request is finished and response is ready with 200
         if (this.readyState == 4 && this.status == 200) {
           // Display the response, it could be a reCAPTCHA challenge
           // page based on your Google Cloud Armor security rule settings.
            document.open();
            document.write(xhr.responseText);
            document.close();

         }
       };
       xhr.send(null);
     }

     grecaptcha.enterprise.ready(function () {
       document.getElementById("execute-button").onclick = () => {
         grecaptcha.enterprise.execute('ACTION_TOKEN_SITE_KEY', {
         }).then(onSuccess, onError);
       };
     });
    </script>

Étape suivante