Provides a captcha field for the Filament Forms

Easy integration with mewebstudio/captcha for the Filament forms.

Requirements:

• PHP extension: ext-gd

Installation

Install the package via composer:

composer require yepsua/filament-captcha-field

Publish the package mewebstudio/captcha config file:

php artisan vendor:publish --provider="Mews\Captcha\CaptchaServiceProvider" --tag="config"

Usage

You can include the captcha field like any other filament field.

    use Yepsua\Filament\Forms\Components\Captcha;
    ...
    protected function getFormSchema(): array
    {
        return [
            Forms\Components\TextInput::make('username'),
            Forms\Components\TextInput::make('password')->type('password'),
            Captcha::make('captcha')
        ];
    }

You can also just display the image and validate the captcha using any other TextInput field:

    use Yepsua\Filament\Forms\Components\CaptchaImage;
    ...
    protected function getFormSchema(): array
    {
        return [
            Forms\Components\TextInput::make('username'),
            Forms\Components\TextInput::make('password')->type('password'),
            Forms\Components\TextInput::make('captcha')->required()->rules('required|captcha'),
            CaptchaImage::make('captchaImg')
        ];
    }

The captcha uses by default the flat config. You can create/update the captcha configs in the file: config/captcha.php.

You can switch to any other available captcha config, like the math config:

    use Yepsua\Filament\Forms\Components\Captcha;
    ...
    protected function getFormSchema(): array
    {
        return [
            Captcha::make('captcha')->config('math')
        ];
    }

For more info about the captcha configuration, please read the mewebstudio/captcha documentation.

Translations

This package and mewebstudio/captcha don't provide any translation for the captcha validation message, but you can translate the message by yourself, just add the item in the file resources/lang/{lang}/validation.php

return [
    ...
    'captcha'             => 'Invalid captcha.',
    ...
]

Case of use: Add a captcha in the filament login form:

1. Extend the Login page class to add the new field into the form:

<?php

namespace  App\Filament\Pages\Auth;

use Filament\Http\Livewire\Auth\Login as BaseLoginPage;
use Yepsua\Filament\Forms\Components\Captcha;

class Login extends BaseLoginPage
{

    protected function getFormSchema(): array
    {
        $formSchema = parent::getFormSchema();
        $formSchema[] = Captcha::make('captcha');

        return $formSchema;
    }
}

2. Use the new Login page instead the original filament page.

return [
    ...
    'auth' => [
        'guard' => env('FILAMENT_AUTH_GUARD', 'web'),
        'pages' => [
            // 'login' => \Filament\Http\Livewire\Auth\Login::class, // <- Original form
            'login' => \App\Filament\Pages\Auth\Login::class,        // <- Form with captcha
        ],
    ],
    ...
]

3. Done. Finally you can test the captcha in the login form.

Testing

composer test

Changelog

Please see CHANGELOG for more information on what has changed recently.

Contributing

Please see CONTRIBUTING for details.

Security Vulnerabilities

Please review our security policy on how to report security vulnerabilities.

Credits

• Omar Yepez
• All Contributors

License

The MIT License (MIT). Please see License File for more information.