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 una singola applicazione.

Se vuoi usare più funzionalità, devi creare una chiave reCAPTCHA per ognuna 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 token di azione e una chiave della 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 sulle 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 per reindirizzare la richiesta a una pagina di verifica reCAPTCHA quando il punteggio è basso.

L'illustrazione seguente mostra un flusso di lavoro che utilizza le funzionalità dei token di sessione reCAPTCHA e della pagina di 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 l'azione di un utente, ad esempio il pagamento. Configura una regola del criterio di sicurezza di Google Cloud Armor per reindirizzare la richiesta a una pagina di verifica reCAPTCHA in una delle seguenti condizioni:

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

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

Lo script di esempio seguente mostra come utilizzare un token di azione reCAPTCHA e reindirizzare a una pagina di verifica reCAPTCHA con il token di azione collegato 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