In this post, I will guide you step by step on how to add Google reCAPTCHA v2 Checkbox to the Laravel Breeze Registration Form. I will use the NoCaptcha Laravel package. Integrating reCAPTCHA into your application helps prevent automated spam registrations.
## Step 1: Obtaining reCAPTCHA Keys
Go to the Google reCAPTCHA website (https://www.google.com/recaptcha) and sign in with your Google account. Click the + sign and fill in the details as follows:
Label: use the domain name of your application
reCAPTCHA type: Select challenge(v2) and tick I’m not a robot checkbox
Domain: in our case add 127.0.0.1 since you are on a local machine but you can change this later to your domain name once on the live server or just add the domain name you will use.
Click submit to generate your site keys
Once the keys are generated copy them and paste them somewhere else as they will be needed later.
Step 2: Installing NoCaptcha Laravel Package
Run this command to install NoCaptcha Package.
composer require anhskohbo/no-captcha
After the package is installed, open your config/app.php file and add the following line to the providers array.
Anhskohbo\NoCaptcha\NoCaptchaServiceProvider::class,
Next, run the following command to publish the package configuration file.
php artisan vendor:publish --provider="Anhskohbo\NoCaptcha\NoCaptchaServiceProvider"
Step 3: Configuring NoCaptcha Package
Open the generated config/nocaptcha.php file. In this file, we will need to supply the NOCAPTCHA_SECRET and NOCAPTCHA_SITEKEY on the .env file.
Go to .env file and paste your site keys as shown below
Step 4: Updating Laravel Breeze Registration Views
Open the resources/views/auth/register.blade.php file. and add the following before the submit button.
<!-- google recaptch -->
<div class="mt-4">
{!! NoCaptcha::renderJs() !!}
{!! NoCaptcha::display() !!}
@if ($errors->has('g-recaptcha-response'))
<x-input-error :messages="$errors->first('g-recaptcha-response')" />
@endif
</div>
Step 5: Updating Laravel Breeze Registration Controller
Open the app/Http/Controllers/Auth/RegisteredUserController.php file. and add the following code to the store method to validate the reCAPTCHA response.
$this->validate($request, [
// Existing validation rules...
'g-recaptcha-response' => 'required|captcha',
],['g-recaptcha-response' => 'Please Verify you are not a robot']);
Note: [‘g-recaptcha-response’ => ‘Please Verify you are not a robot’] used to set a more user friendly message in case of an error.
Start the server and go to http://localhost:8000/register
You should see the new checkbox of Google Recaptcha
Top comments (1)
How are you? Can you help me with validations for my controller