Laravel 10 Captcha Configuration
1. Install Laravel 10
composer create-project --prefer-dist laravel/laravel Captcha-Laravel
Next, goto the project folder:
cd Captcha-Laravel
2. Install Captcha Module
composer require mews/captcha
3. Configure Captcha Package
//providers/config/app.php.
'providers' => [
...
Mews\Captcha\CaptchaServiceProvider::class,
]
'aliases' => [
...
'Captcha' => Mews\Captcha\Facades\Captcha::class,
]
4. Captcha Custom Config Settings
php artisan vendor:publish
A list of options manifests on your terminal screen, select the "Mews\Captcha\CaptchaServiceProvider" list number and press enter.
Inside the config/captcha.php file, here you can enable or disable settings based on your requirement.
return [
'default' => [
'length' => 5,
'width' => 120,
'height' => 36,
'quality' => 90,
'math' => true, //Enable Math Captcha
'expire' => 60, //Stateless/API captcha expiration
],
// ...
];
5. Create Captcha Controller
php artisan make:controller CaptchaController
//app/Http/Controllers/CaptchaController.php
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class CaptchaController extends Controller
{
public function index()
{
return view('index');
}
public function register(Request $request)
{
$request->validate([
'name' => 'required',
'email' => 'required|email',
'password' => 'required',
'captcha' => 'required|captcha'
]);
}
public function reloadCaptcha()
{
return response()->json(['captcha'=> captcha_img()]);
}
}
index() – It loads the form template in the view with the captcha element.
register() – Validates the entire form, including the captcha input field.
reloadCaptcha() – It refreshes the captcha code or text.
6. Create Routes
//routes/web.php
<?php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\CaptchaController;
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
*/
Route::get('/register', [CaptchaController::class, 'index']);
Route::post('/register-post', [CaptchaController::class, 'register']);
Route::get('/reload-captcha', [CaptchaController::class, 'reloadCaptcha']);
7. Create Register Form View
//resources/views/index.blade.php
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Laravel 10 Captcha - chirags.in</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
</head>
<body>
<div class="container mt-5">
<h2>Laravel Captcha Code Example</h2>
@if ($errors->any())
<div class="alert alert-danger">
<ul>
@foreach ($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
</ul>
</div><br />
@endif
<form method="post" action="{{url('register-post')}}">
@csrf
<div class="form-group">
<label>Name</label>
<input type="text" class="form-control" name="name">
</div>
<div class="form-group">
<label>Email</label>
<input type="text" class="form-control" name="email">
</div>
<div class="form-group">
<label for="Password">Password</label>
<input type="text" class="form-control" name="password">
</div>
<div class="form-group mt-4 mb-4">
<div class="captcha">
<span>{!! captcha_img() !!}</span>
<button type="button" class="btn btn-danger" class="reload" id="reload">
↻
</button>
</div>
</div>
<div class="form-group mb-4">
<input id="captcha" type="text" class="form-control" placeholder="Enter Captcha" name="captcha">
</div>
<div class="form-group">
<button type="submit" class="btn btn-primary btn-block">Submit</button>
</div>
</form>
</div>
</body>
<script type="text/javascript">
$('#reload').click(function () {
$.ajax({
type: 'GET',
url: 'reload-captcha',
success: function (data) {
$(".captcha span").html(data.captcha);
}
});
});
</script>
</html>
Now run the application with below command.
php artisan serve
Open the register form using the following URL:
http://127.0.0.1:8000/register
