Esempi di integrazione con Google Cloud Armor

Questo documento mostra esempi di come implementare le funzionalità di reCAPTCHA per WAF per Google Cloud Armor.

Puoi utilizzare una o più funzionalità di reCAPTCHA per WAF in un singolo un'applicazione.

Se vuoi utilizzare più di una funzionalità, devi creare una chiave reCAPTCHA per ciascuna di queste funzionalità e utilizzarle nella tua applicazione. Ad esempio, se vuoi utilizzare i token di azione reCAPTCHA e la pagina di verifica reCAPTCHA, devi creare una chiave per i token di azione e una chiave per la pagina di verifica e utilizzarle nella tua applicazione.

Esempio 1: utilizzo dei token di sessione reCAPTCHA e della pagina di verifica reCAPTCHA

Puoi aggiungere un token di sessione reCAPTCHA alle pagine a cui un utente potrebbe accedere in modo che il cookie venga aggiornato periodicamente, ad esempio una pagina di accesso. Configura una regola del criterio di sicurezza di Google Cloud Armor a cui reindirizzare la richiesta una pagina di verifica reCAPTCHA quando il punteggio è basso.

L'illustrazione seguente mostra un flusso di lavoro che utilizza il token di sessione reCAPTCHA e le funzionalità della pagina della verifica reCAPTCHA:

Esempio 2: utilizzo dei token di azione reCAPTCHA e della pagina di verifica reCAPTCHA

Puoi aggiungere un token di azione reCAPTCHA per proteggere un'azione dell'utente, come il pagamento. Configura una regola del criterio di sicurezza di Google Cloud Armor a cui reindirizzare la richiesta una pagina di verifica reCAPTCHA in una qualsiasi delle seguenti condizioni:

  • Il punteggio è basso.
  • L'attributo action_name del token di azione non corrisponde all'utente un'azione protetta.

L'illustrazione seguente mostra un flusso di lavoro che utilizza il token di azione reCAPTCHA e delle funzionalità della pagina di verifica reCAPTCHA:

Lo script di esempio seguente mostra come utilizzare un token di azione reCAPTCHA e reindirizza a una pagina di verifica reCAPTCHA con il token di azione allegato come intestazione:

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

Passaggi successivi