{"id":25798,"date":"2021-06-07T13:54:00","date_gmt":"2021-06-07T10:54:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=25798"},"modified":"2021-10-18T03:04:48","modified_gmt":"2021-10-18T00:04:48","slug":"una-guida-sull-aggiunta-di-google-recaptcha-v3-al-tuo-sito-web-laravel","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/it\/una-guida-sull-aggiunta-di-google-recaptcha-v3-al-tuo-sito-web-laravel\/","title":{"rendered":"Una guida sull’aggiunta di Google reCAPTCHA v3 al tuo sito web Laravel"},"content":{"rendered":"

In passato ho pubblicato un articolo sull’aggiunta di Google reCAPTCHA ai moduli Laravel<\/a>. Google ha quindi portato la prossima versione v3 di reCAPTCHA. Uno dei nostri lettori ha chiesto come integrare reCAPTCHA v3 in un’applicazione Laravel.<\/p>\n

reCAPTCHA v3 ha un comportamento leggermente diverso. A differenza della versione precedente di reCAPTCHA, non \u00e8 necessario inserire captcha all’interno del modulo. In questa versione, i tuoi visitatori non hanno bisogno di risolvere un puzzle. Invece, vedrai l’icona reCAPTCHA nell’angolo in basso a destra del tuo sito web. Questa versione v3 di reCAPTCHA combatte i bot in background. Ancora pi\u00f9 importante, non \u00e8 necessario aggiungere captcha in ogni forma. Basta aggiungerlo una volta e protegger\u00e0 tutte le forme del tuo sito web.<\/p>\n

In questo articolo, studiamo come un utente pu\u00f2 aggiungere reCAPTCHA v3 al proprio sito Web Laravel. L’aggiunta di reCAPTCHA protegge il tuo sito Web da bot e spam.<\/p>\n

Ottieni la chiave del sito e la chiave segreta di reCAPTCHA<\/h3>\n

Per iniziare, devi prima registrare il tuo sito con Google reCAPTCHA. Vai su Google reCAPTCHA<\/a> e fai clic sull’icona ‘+’ per registrare il tuo sito. Nella pagina successiva, aggiungi il dominio del tuo sito web, scegli l’opzione ‘reCAPTCHA v3’. Se vuoi testarlo su un server locale, nel campo del dominio dovresti aggiungere "localhost".<\/p>\n

\"Una<\/a><\/p>\n

Dopo aver premuto il pulsante di invio, otterrai la chiave del sito e la chiave segreta. Copia queste chiavi. Richiederanno i passaggi successivi.<\/p>\n

\"Una<\/a><\/p>\n

Installa e configura la libreria reCAPTCHA di Laravel<\/h3>\n

Vai al tuo progetto Laravel e installa la libreria di biscolab<\/a> che \u00e8 costruita per integrare reCAPTCHA in Laravel. Apri il terminale nella directory principale del tuo progetto ed esegui il comando:<\/p>\n

composer require biscolab\/laravel-recaptcha<\/code><\/pre>\n
Al momento dell’installazione della libreria, pubblicare il file di configurazione utilizzando il comando seguente.<\/p>\n
php artisan vendor:publish --provider=\"BiscolabReCaptchaReCaptchaServiceProvider\"<\/code><\/pre>\n
Apri il .env<\/code>file nel tuo editor e aggiungi il tuo sito e le chiavi segrete di reCAPTCHA come mostrato di seguito.<\/p>\n
RECAPTCHA_SITE_KEY=ADD_YOUR_SITE_KEY\nRECAPTCHA_SECRET_KEY=ADD_YOUR_SECRET_KEY<\/code><\/pre>\n
Assicurati di sostituire i segnaposto "ADD_YOUR_SITE_KEY" e "ADD_YOUR_SECRET_KEY" con i valori effettivi. Quindi, apri config\/recaptcha.php<\/code>e imposta la versione su v3.<\/p>\n
return [\n\u00a0\u00a0\u00a0\u00a0...\n\u00a0\u00a0\u00a0\u00a0'version' => 'v3',\n\u00a0\u00a0\u00a0\u00a0...\n];<\/code><\/pre>\n
Dopo questo cancella la cache di configurazione usando il comando:<\/p>\n
php artisan config:cache<\/code><\/pre>\n
Aggiungi Google reCAPTCHA v3 al tuo sito web Laravel<\/h3>\n
Abbiamo finito con tutte le impostazioni e tutto pronto per aggiungere reCAPTCHA sul sito web. Per questo devi prima aggiungere il meta tag HTML per csrf-token nella sezione head.<\/p>\n
<meta name=\"csrf-token\" content=\"{{ csrf_token() }}\"><\/code><\/pre>\n
Se il tuo sito web ha gi\u00e0 aggiunto questo tag, ignora il passaggio precedente. Quindi, inserisci l’ htmlScriptTagJsApi()<\/code>helper prima di chiudere il tag head.<\/p>\n
<!DOCTYPE html>\n<html>\n\u00a0\u00a0\u00a0\u00a0<head>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0...\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0...\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0{!! htmlScriptTagJsApi() !!}\n\u00a0\u00a0\u00a0\u00a0<\/head><\/code><\/pre>\n
Ora vai sul tuo sito web, ricaricalo e dovresti vedere l’icona reCAPTCHA nell’angolo in basso a destra di una pagina. Significa che il tuo sito web \u00e8 ora protetto con Google reCAPTCHA.<\/p>\n
Hai finito con l’aggiunta di Google reCAPTCHA sul tuo sito web Laravel. Per ulteriore curiosit\u00e0, se vuoi vedere la risposta di reCAPTCHA allora devi modificare leggermente il codice nel tag head.<\/p>\n
<head>\n...\n<meta name=\"csrf-token\" content=\"{{ csrf_token() }}\">\n<script type=\"text\/javascript\">\nfunction callbackThen(response){\n\u00a0\u00a0\u00a0\u00a0\/\/ read HTTP status\n\u00a0\u00a0\u00a0\u00a0console.log(response.status);\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\/\/ read Promise object\n\u00a0\u00a0\u00a0\u00a0response.json().then(function(data){\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0console.log(data);\n\u00a0\u00a0\u00a0\u00a0});\n}\nfunction callbackCatch(error){\n\u00a0\u00a0\u00a0\u00a0console.error('Error:', error)\n}\n<\/script>\n\u00a0\n{!! htmlScriptTagJsApi([\n\u00a0\u00a0\u00a0\u00a0'callback_then' => 'callbackThen',\n\u00a0\u00a0\u00a0\u00a0'callback_catch' => 'callbackCatch'\n]) !!}\n<\/head><\/code><\/pre>\n
Ricarica la pagina e controlla nella console del browser, vedrai la risposta del Google reCAPTCHA. Nel mio caso, \u00e8 mostrato come uno screenshot qui sotto.<\/p>\n
\"Una<\/a><\/p>\n
articoli Correlati<\/h4>\n