Integrare Google reCAPTCHA v3 in un'applicazione web

Per poter integrare reCAPTCHA v3 in un'applicazione web bisogna innanzitutto generare una coppia di chiavi (chiave del sito e chiave segreta), è possibile effetuare questa operazione nel sito ufficiale

google.com/recaptcha/about

tramite "Admin Console"

effettuare il login con un account Google.

Nella schermata successiva scegliere un "Etichetta", "Tipo di reCAPTCHA" (selezionare reCAPTCHA v3), e specificare uno o più domini in "Domini", in particolare è possibile specificare come dominio localhost per poter lavorare in un ambiente di test

selezionare "Accetta i Termini di servizio di reCAPTCHA" e poi "Invia".

Per poter accedere alla coppia di chiavi seguire il percorso Impostazioni > Chiavi reCAPTCHA

Adesso facciamo riferimento a questa documentazione ufficiale di reCAPTCHA v3 per creare la nostra applicazione

developers.google.com/recaptcha/docs/v3

e come si evince dalla suddetta documentazione, il primo step prevede l'inclusione del seguente file js

<script src="https://www.google.com/recaptcha/api.js"></script>

il secondo step è di aggiungere dei perticolari attributi al pulsante submit del nostro modulo web

Codice HTML

<script>
  function onSubmit(token) {
    document.getElementById("form").submit();
  }
</script>

<form method="post" action="send.php" id="form">
  ..... .....

  <button
    class="g-recaptcha"
    data-sitekey="--chiave sito--"
    data-callback="onSubmit"
    data-action="submit"
  >
    Submit
  </button>
</form>

aggiungiamo una classe pari a g-recaptcha, data-sitekey è la chiave del sito generata in precedenza. data-callback è la funzione di callback (onSubmit), data-action è uguale a submit, poichè in questo caso l'evento è un invio di dati tramite form, send.php ( action="send.php" ) è il file php a cui invieremo i dati.

Fin qui abbiamo configurato la nostra applicazione lato client, il passo successivo è di verificare la validità del recaptcha in un file php che riceverà i dati dal form.

Google mette a disposizione per programmatori PHP la libreria

google/recaptcha

è possibile installarla tramite composer utilizzando il seguente comando

composer require google/recaptcha "^1.2"

oppure scaricando il file .zip

github.com/google/recaptcha/archive/master.zip

Se abbiamo scelto la prima opzione, includiamo il file autoload.php specificando il percorso corretto

send.php

<?php

require_once "vendor/autoload.php";

$secret = "-- chiave segreta --";

$recaptcha = new \ReCaptcha\ReCaptcha(
    $secret,
    new \ReCaptcha\RequestMethod\CurlPost()
);

$remoteIp = $_SERVER["REMOTE_ADDR"];

$gRecaptchaResponse = $_POST["g-recaptcha-response"];

$response = $recaptcha->verify($gRecaptchaResponse, $remoteIp);

if ($response->isSuccess()) {
    echo "Verified!";

} else {
    echo $response->getErrorCodes();

}

$secret è la chiave segreta che abbiamo generato in precedenza, $recaptcha è l'instanza della classe ReCaptcha a cui passiamo come parametro la chiave segreta, $remoteIp è il nostro indirizzo IP, $gRecaptchaResponse è il token inviato tramite post dal form, $response è il risultato ottenuto tramite il metodo verify, se $response->isSuccess() è un valore booleano TRUE il recaptcha è corretto, e viceversa, in particolare la variabile $response è un oggetto come il seguente

ReCaptcha\Response Object
(
    [success:ReCaptcha\Response:private] => 1
    [errorCodes:ReCaptcha\Response:private] => Array
        (
        )

    [hostname:ReCaptcha\Response:private] => localhost
    [challengeTs:ReCaptcha\Response:private] => 2022-11-03T14:53:44Z
    [apkPackageName:ReCaptcha\Response:private] => 
    [score:ReCaptcha\Response:private] => 0.9
    [action:ReCaptcha\Response:private] => submit
)