Laravel 11 - How to Integrate Google reCAPTCHA v2

Quick Overview

Step # 1 : Create fresh Laravel project with Breeze Authentication.

laravel new reCAPTCHAV2

composer create-project laravel/laravel --prefer-dist reCAPTCHAV2

1. Would you like to install the starter kit? — Select Breeze.
2. Choose your stack. — Select Blade.
3. Dark mode support. — Select no.
4. Testing framework. — Select Pest.
5. Database for your application. — Select mysql.
6. Run the default database migration? — Select yes.
   
   

Step # 2 : Access the project.

cd c:xampp/htdocs/reCAPTCHAV2

Step # 3 : Install reCAPTCHA V2 package.

composer require anhskohbo/no-captcha

Step # 4 : Publish the Config file (Optional).

php artisan vendor:publish --provider="Anhskohbo\NoCaptcha\NoCaptchaServiceProvider"

Step # 5 : Obtain reCAPTCHA V2 Site Key and Site Secret.

• Visit the reCAPTCHA Admin Console (Link : https://www.google.com/recaptcha/admin/create).
• Sign up or log in to your Google account if you haven't already.
• Create a label for your site (this will help you identify your keys later).
• Choose reCAPTCHA v2 and select the I'm not a robot checkbox option.
• Define your site's domain(s) for security purposes.
• Click Submit to generate your reCAPTCHA keys.
  
  

NOCAPTCHA_SITEKEY=your-site-key
NOCAPTCHA_SECRET=your-secret-key

Step # 6 : Add reCAPTCHA v2 to the Form.

<div class="mt-4">
    <!-- Render the necessary JavaScript for the reCAPTCHA widget -->
    {!! NoCaptcha::renderJs() !!}
    <!-- Display the reCAPTCHA widget -->
    {!! NoCaptcha::display() !!}
    <!-- Display validation error message for the reCAPTCHA response -->
    <span style="color: red;">
        @if($errors->has('g-recaptcha-response'))
            <!-- Show the first error message related to reCAPTCHA -->
            {{$errors->first('g-recaptcha-response')}}
        @endif
    </span>
</div>

Step # 7 : Validate reCAPTCHA v2.

<?php
namespace App\Http\Controllers\Auth;
use App\Http\Controllers\Controller;
use App\Models\User;
use Illuminate\Auth\Events\Registered;
use Illuminate\Http\RedirectResponse;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Auth;
use Illuminate\Support\Facades\Hash;
use Illuminate\Validation\Rules;
use Illuminate\View\View;
// Importing the NoCaptcha facade for integrating Google reCAPTCHA v2.
use Anhskohbo\NoCaptcha\Facades\NoCaptcha;
class RegisteredUserController extends Controller
{
    /**
     * Display the registration view.
     */
    public function create(): View
    {
        return view('auth.register');
    }
    /**
     * Handle an incoming registration request.
     *
     * @throws \Illuminate\Validation\ValidationException
     */
    public function store(Request $request): RedirectResponse
    {
        $request->validate([
            'name' => ['required', 'string', 'max:255'],
            'email' => ['required', 'string', 'lowercase', 'email', 'max:255', 'unique:'.User::class],
            'password' => ['required', 'confirmed', Rules\Password::defaults()],
            // Validate the reCAPTCHA response to ensure it is present and valid
            'g-recaptcha-response' => 'required|captcha',
        ]);
        $user = User::create([
            'name' => $request->name,
            'email' => $request->email,
            'password' => Hash::make($request->password),
        ]);
        event(new Registered($user));
        Auth::login($user);
        return redirect(route('dashboard', absolute: false));
    }
}

Step # 8 : It's time to test.

php artisan serve

Conclusion