Laravel 9 - Google reCAPTCHA v2
Laravel 9 - Google reCAPTCHA v2
In this tutorial, we will discuss how to implement Google reCAPTCHA v2 in Laravel 9. Google reCAPTCHA v2 is a security service that helps distinguish between humans and bots by presenting challenges such as "I'm not a robot" checkboxes or image verification tasks. It protects websites from spam and abuse while minimizing user friction.
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 recaptchav2
Or use
Non Global Command : composer create-project laravel/laravel --prefer-dist recaptchav2
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 recaptchav2 and update .env file.
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=recaptchav2
DB_USERNAME="your database username"
DB_PASSWORD="your database password"
Step # 4 : Install Laravel reCAPTCHA v2 package.
Command : composer require biscolab/laravel-recaptcha
Step # 5 : Let's get the google reCAPTCHA v2 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 2 and select the type of validation you want.
Define the domain
127.0.0.1 // For Localhost
For Google reCAPTCHA v2, 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.
RECAPTCHAV2_SITEKEY="Your site key here"
RECAPTCHAV2_SECRET="Your secret key here
Step # 7 : Publish config file (Optional)
Command : php artisan vendor:publish --provider="Biscolab\ReCaptcha\ReCaptchaServiceProvider"
Make sure v2 is selected in config file.
'version' => 'v2', // supported: "v3"|"v2"|"invisible"
Step # 8 : Init reCAPTCHA v2 Javascript.
Copy and add it to header or footer of master layout
{!! ReCaptcha::htmlScriptTagJsApi() !!}
Step # 9 : Update the register form.
Include the below div just after the password-confirmation div<div class="form-group row">
<div class="col-md-6 offset-md-4 mb-2"> {!! htmlFormSnippet() !!} </div>
</div>
Step # 10 : Validating reCAPTCHA v2.
Access RegisterController and add the g-recaptcha-response validation if you want.
'g-recaptcha-response' => 'recaptcha',
Step # 11 Test reCAPTCHA v2.
It's time to test.
To clear all the cache
Command : php artisan optimize:clear
Or
Command : php artisan config:cache & php artisan cache:clear
Or
Hard reload tab
Share this with friends!
To engage in commentary, kindly proceed by logging in or registering
Subscribe to Our Newsletter
Stay ahead of the curve! Join our newsletter to see what everyone’s talking about.
Continue with Google
0 Comments