Laravel 9 - Google reCAPTCHA v3

Touseef Afridi
28 Aug 24

Laravel 9 - Google reCAPTCHA v3

In this tutorial, we will discuss how to implement Google reCAPTCHA v3 in Laravel 9. Google reCAPTCHA v3 is a tool that protects websites from spam and abuse by analyzing user interactions to detect and prevent automated bot activities. It provides a seamless user experience without interrupting users with CAPTCHA challenges.


If you're a video person, feel free to skip the post and check out the video instead!


Step # 1 : Create fresh Laravel project.

Global Command : laravel new recaptcha
Or use
Non Global Command : composer create-project laravel/laravel --prefer-dist recaptcha

Step # 2 : Let's install UI authentication.

Install UI authentication, generate the UI auth scaffolding, install the necessary NPM dependencies, and compile the frontend assets using Laravel Mix using below commands.
Command : composer require laravel/ui
Command : php artisan ui vue --auth
Command : npm install && npm run dev

Step # 3 : Create a database.

Create a database named recaptcha and update .env file.
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=recaptcha
DB_USERNAME="your database username"
DB_PASSWORD="your database password"

Step # 4 : Install Laravel reCAPTCHA v3 package.

Command : composer require josiasmontag/laravel-recaptchav3

Step # 5 : Let's get the google reCAPTCHA v3 site key and secret key.

Access below link, sing-up or login to your google account.

Link : https://www.google.com/recaptcha/admin/create
Create a label for your site.
Select the reCAPTCHA version 3.
Define the domain
127.0.0.1 //For localhost
For Google reCAPTCHA v3, you should define 127.0.0.1 as the domain name as localhost is not accepted. HTTP or HTTPS is not required, and there is no need to specify the port
Submit the form and you will get the site key and secret key.

Step # 6 : Add reCAPTCHA site key and secret key to env.

RECAPTCHAV3_SITEKEY="Your site key here"
RECAPTCHAV3_SECRET="Your secret key here

Step # 7 : Publish config file (Optional)

Command : php artisan vendor:publish --provider="Lunaweb\RecaptchaV3\Providers\RecaptchaV3ServiceProvider"

Step # 8 : Init reCAPTCHA Javascript.

Copy and add it to header or footer of master layout

{!! RecaptchaV3::initJs() !!}

Step # 9 : Access the register.blade.php file.

Replace the submit button
<button type="submit" class="btn btn-primary">
 {{ __('Register') }}
</button>
To
{!! RecaptchaV3::field('register') !!}
<input type="submit" value="Register"></input>

Step # 10 : Validating reCAPTCHA v3.

Access RegisterController and add the g-recaptcha-response validation if you want.
'g-recaptcha-response' => 'required|recaptchav3:register,0.5'

Step # 11 Test reCAPTCHA v3.

It's time to test. Try registering a user and it will automatically detect if its a bot based on the score validation mentioned in step 10.

'g-recaptcha-response' => 'required|recaptchav3:register,0.5'
The 0.5 score represents the minimum threshold for the reCAPTCHA validation. This means that the reCAPTCHA response must have a score greater than or equal to 0.5 for the validation to pass. If the score is less than 0.5, the validation will fail.

Step # 12 : Validation logic example.

use Lunaweb\RecaptchaV3\Facades\RecaptchaV3;
Using condition based on score.
$score = RecaptchaV3::verify($request->get('g-recaptcha-response'), 'register');
dd($score);
And you can build you logic based on score.

Share this with friends!


"Give this post some love and slap that 💖 button as if it owes you money! 💸😄"
0

0 Comments

To engage in commentary, kindly proceed by logging in or registering