goedemiddag / laravel-recaptcha
A simple and easy to use Google ReCaptcha v3 package for Laravel
Requires
- php: ^8.1
- google/recaptcha: ^1.3
- laravel/framework: ^10.0|^11.0
Requires (Dev)
- laravel/pint: ^1.16
- orchestra/testbench: ^8.0|^9.0
- phpstan/phpstan: ^1.11
This package is auto-updated.
Last update: 2024-10-28 10:26:31 UTC
README
This is a Laravel package for Google reCAPTCHA v3.
Installation
You can install the package via composer:
composer require goedemiddag/laravel-recaptcha
Add the following environment variables to your .env
file:
RECAPTCHA_SITE_KEY=YOUR_SITE_KEY RECAPTCHA_SECRET_KEY=YOUR_SECRET_KEY RECAPTCHA_THRESHOLD=0.3
Config
You can optionally publish the config file:
php artisan vendor:publish --provider="Goedemiddag\ReCaptcha\ReCaptchaServiceProvider" --tag="recaptcha-config"
This is the contents of the published config file:
return [ 'site_key' => env('RECAPTCHA_SITE_KEY'), 'secret_key' => env('RECAPTCHA_SECRET_KEY'), // The threshold to pass the recaptcha validation, from 0 (easiest) to 1 (hardest) 'threshold' => env('RECAPTCHA_THRESHOLD', 0.3), // Provide IP addresses that shouldn't be validated 'skip_ips' => [ // 127.0.0.1 ], ];
Translations
This package offers Dutch and English translations by default. You can optionally publish the translations:
php artisan vendor:publish --provider="Goedemiddag\ReCaptcha\ReCaptchaServiceProvider" --tag="recaptcha-lang"
Usage
This package aims to provide the Google ReCaptcha v3 validation in the backend of your application and offers some tools to use it in the frontend.
Quick start
Add the <x-recaptcha::input />
blade component to your form:
<form method="POST">
@csrf
<x-recaptcha::input />
...
<button type="submit">Submit</button>
</form>
Add the <x-recaptcha::script />
blade component to your end of your layout:
<body>
...page content...
<x-recaptcha::script />
</body>
Bind an event listener to the form submit event, please adjust this for your application:
document.querySelector('form').addEventListener('submit', function (event) { event.preventDefault(); window.reCaptcha.render('submit', function (token) { // Set token value event.target.querySelector('input[name="g-recaptcha-response"]').value = token; // Submit form event.target.submit(); }); });
Add the ReCaptchaRule
to your form request:
public function rules(): array { return [ 'g-recaptcha-response' => ['required', new ReCaptchaRule()], ]; }
Contributing
Found a bug or want to add a new feature? Great! There are also many other ways to make meaningful contributions such as reviewing outstanding pull requests and writing documentation. Even opening an issue for a bug you found is appreciated.
When you create a pull request, make sure it is tested, following the code standard (run composer pint:fix
to take care of that for you) and please create one pull request per feature. In exchange, you will be credited as contributor.