# Laravel 12 Captcha Configuration

[**inchirags@gmail.com**](mailto:inchirags@gmail.com) Chirag's Laravel Tutorial [**https://www.chirags.in**](https://www.chirags.in/)

\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*

Laravel 12 Captcha Configuration

\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*

In Hindi YouTube Video:

%[https://www.youtube.com/watch?v=LU6YYIuQ8GY] 

In English YouTube Video:

%[https://www.youtube.com/watch?v=1u9eR8Ex2rE] 

Configuring a CAPTCHA in Laravel 12 involves using a package like mews/captcha or anhskohbo/no-captcha. Below is a step-by-step guide to set up CAPTCHA in Laravel 12, including the view page coding.

Step 1: Install Laravel 12

If you haven’t already set up Laravel 12, create a new Laravel project:

```plaintext
composer create-project laravel/laravel laravel-captcha
```

```plaintext
cd laravel-captcha
```

Open the Laravel project folder in any text editor like vscode, sublime, notepad++ etc.

Step 2: Install a CAPTCHA Package

For this example, we’ll use the mews/captcha package. Install it via Composer:

```plaintext
composer require mews/captcha
```

Step 3: Publish the CAPTCHA Configuration File

Publish the configuration file to customize CAPTCHA settings:

```plaintext
php artisan vendor:publish --provider="Mews\Captcha\CaptchaServiceProvider"
```

This will create a config/captcha.php file where you can configure the CAPTCHA settings.

Step 4: Configure CAPTCHA

Open the config/captcha.php file and customize the settings as needed. For example:

```plaintext
return [
    'characters' => '2346789abcdefghjmnpqrtuxyzABCDEFGHJMNPQRTUXYZ',
    'length' => 6,
    'width' => 120,
    'height' => 36,
    'quality' => 90,
    'math' => false, // Enable math CAPTCHA if needed
];
```

Step 5: Add CAPTCHA to Your Form

In your view file (e.g., resources/views/contact.blade.php), add the CAPTCHA field:

```plaintext
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Contact Form with CAPTCHA</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
    <h1>Contact Us</h1>
    @if ($errors->any())
        <div>
            <ul>
                @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div>
    @endif
    @if (session('success'))
            {{ session('success') }}
    @endif
    <form action="{{ route('contact.submit') }}" method="POST">
        @csrf
        <div>
            <label for="name">Name:</label>
            <input type="text" name="name" id="name" required>
        </div>
        <div>
            <label for="email">Email:</label>
            <input type="email" name="email" id="email" required>
        </div>
        <div>
            <label for="message">Message:</label>
            <textarea name="message" id="message" required></textarea>
        </div>
        <div>
            <label for="captcha">CAPTCHA:</label>
            <div class="captcha">
                <span>{!! captcha_img() !!}</span>
                <button type="button" onclick="refreshCaptcha()">Refresh</button>
            </div>
            <input type="text" name="captcha" id="captcha" required>
        </div>
        <button type="submit">Submit</button>
    </form>
    <script>
        function refreshCaptcha() {
            $.ajax({
                url: '/refresh-captcha',
                type: 'GET',
                headers: {
                    'X-CSRF-TOKEN': '{{ csrf_token() }}'
                },
                success: function(data) {
                    $(".captcha span").html(data.captcha);
                },
                error: function(error) {
                    console.error('Error refreshing CAPTCHA:', error);
                }
            });
        }
    </script>
</body>
</html>
```

Step 6: Validate CAPTCHA in the Controller

```plaintext
php artisan make:controller ContactController
```

In your controller (e.g., app/Http/Controllers/ContactController.php), validate the CAPTCHA input:

```plaintext
<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Mews\Captcha\Facades\Captcha;

class ContactController extends Controller
{
    public function showForm()
    {
        return view('contact');
    }

    public function submitForm(Request $request)
    {
        $request->validate([
            'name' => 'required|string|max:255',
            'email' => 'required|email|max:255',
            'message' => 'required|string',
            'captcha' => 'required|captcha', // Validate CAPTCHA
        ]);

        // Process the form data

        return redirect()->back()->with('success', 'Your message has been sent!');
    }
    
    public function refreshCaptcha()
    {
        return response()->json(['captcha' => captcha_img()]);
    }

}

```

Step 7: Add Routes

Define the routes in routes/web.php:

```plaintext
use App\Http\Controllers\ContactController;
Route::get('/contact', [ContactController::class, 'showForm'])->name('contact.form');
Route::post('/contact', [ContactController::class, 'submitForm'])->name('contact.submit');
Route::get('/refresh-captcha', [ContactController::class, 'refreshCaptcha'])->name('refresh.captcha');
```

Step 8: Test the CAPTCHA

Visit

```plaintext
http://127.0.0.1:8000/contact
```

in your browser.

Fill out the form and submit it.

If the CAPTCHA is incorrect, the form will return an error. If correct, the form will submit successfully.

That’s it! You’ve successfully integrated CAPTCHA into your Laravel 12 application. Let me know if you need further assistance!

For any doubts and query, please write on YouTube video comments section.

Note : Flow the Process shown in video.

😉Please, Subscribe and like for more videos:

[**https://www.youtube.com/@chiragtutorial**](https://www.youtube.com/@chiragtutorial)

💛Don't forget to, 💘Follow, 💝Like, 💖Share 💙&, Comment

Thanks & Regards,

Chitt Ranjan Mahto "Chirag"

\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_

Note: All scripts used in this demo will be available in our website.

Link will be available in description.
