INTEGRAZIONE DI RECAPTCHA V3 IN UN SITO WEB: GUIDA HTML/JS E PHP

03/05/2023

Introduzione

La sicurezza online è sempre più importante, e proteggere i propri siti web da attacchi automatizzati è diventato essenziale. Google ReCaptcha v3 è uno strumento potente ed efficiente per rilevare e bloccare attività sospette senza interferire con l'esperienza utente. In questo articolo, vi mostreremo come integrare ReCaptcha v3 nel vostro sito web utilizzando HTML, JavaScript e PHP.

ReCaptcha logo

Parte 1: Integrazione lato client (HTML/JS)

Per iniziare, registrati su Google ReCaptcha e ottieni le chiavi API per la versione 3. Avrai bisogno della chiave del sito (public key) e della chiave segreta (secret key).

Includi il JavaScript di ReCaptcha nel tuo HTML. Aggiungi il seguente script nella sezione <head> del tuo file HTML:

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

Sostituisci TUA_CHIAVE_DEL_SITO con la chiave del sito ottenuta in precedenza.

Verifica la risposta ReCaptcha con JavaScript. Aggiungi il seguente snippet di codice JavaScript nel tuo file HTML o JS, preferibilmente prima della chiusura del tag :

grecaptcha.ready(function() {
    grecaptcha.execute('TUA_CHIAVE_DEL_SITO', {action: 'submit'}).then(function(token) {
        // Aggiungi il token al tuo form
        var form = document.getElementById('your-form-id');
        var input = document.createElement('input');
        input.type = 'hidden';
        input.name = 'g-recaptcha-response';
        input.value = token;
        form.appendChild(input);
    });
});

Sostituisci TUA_CHIAVE_DEL_SITO con la chiave del sito e "your-form-id" con l'ID del tuo form HTML.

Parte 2: Verifica lato server (PHP)

Verifica la risposta ReCaptcha nel tuo script PHP. Aggiungi il seguente snippet di codice PHP nel tuo script di elaborazione del form:

$recaptcha_url = 'https://www.google.com/recaptcha/api/siteverify';
$recaptcha_secret = 'TUA_CHIAVE_SEGRETA';
$recaptcha_response = $_POST['g-recaptcha-response'];

// Recupera la risposta di verifica dall'API di Google
$recaptcha = file_get_contents($recaptcha_url . '?secret=' . $recaptcha_secret . '&response=' . $recaptcha_response);
$recaptcha = json_decode($recaptcha);

// Verifica il punteggio ottenuto
if ($recaptcha->success == true && $recaptcha->score >= 0.5) {
    // La richiesta è valida, procedi con l'elaborazione del form
} else {
    // La richiesta è sospetta, gestisci il caso come preferisci (es. mostra un errore)
}

Sostituisci TUA_CHIAVE_SEGRETA con la chiave segreta ottenuta in precedenza. Ricorda che il punteggio varia da 0 a 1, dove 1 indica che la richiesta è molto probabilmente umana. Puoi personalizzare il valore di soglia (0.5 nell'esempio) in base alle tue esigenze.

A questo punto, sei in grado di gestire i risultati della verifica ReCaptcha nel tuo script PHP. Se la richiesta supera il punteggio minimo, puoi procedere con l'elaborazione del form, ad esempio inviando un'email o registrando un utente nel tuo database. Se la richiesta è sospetta, puoi decidere come gestire il caso, ad esempio mostrando un messaggio di errore, chiedendo all'utente di riprovare o implementando ulteriori controlli di sicurezza.

Conclusioni

L'integrazione di ReCaptcha v3 nel tuo sito web è un ottimo modo per proteggerlo da attacchi automatizzati senza compromettere l'esperienza utente. Con pochi semplici passaggi, puoi implementare questo strumento sia lato client (HTML/JS) che lato server (PHP) e migliorare la sicurezza del tuo sito. Ricorda di consultare la guida ufficiale di Google per ulteriori informazioni e risorse, come ad esempio immagini e dettagli sul funzionamento di ReCaptcha v3. Buona programmazione!


Torna alla home

Commenti

0 commenti


Il tuo nome o email (Se usi l'email potrai essere notificato delle risposte)
Il tuo messaggio