Hello Buddies
Today we're going to learn Google ReCAPTCHA Form Validation in Laravel 6 Tutorials. You can easily add Google Recaptcha in Laravel 6. We will add the Laravel 6 code Google Recaptcha with form validation using the anhskohbo / no-captcha composer package.
Google ReCaptcha is a system similar to Captcha that offers security against hackers and sticks or curl requests. It ensures that a computer user is human. It is the best and most widely used captcha system in which users only have to click a checkbox and in some cases have to select similar images related to the Conman question.
In this example we create a simple registration form and implement the Google Captcha code. Before we use the Google Captcha code, we install the composer package "Anhskohbo / No-Captcha" for Google Captcha. Just follow a few steps and you will get the new Google code in your Laravel 6 application.
Step 1 : Download Laravel 6
First, we need to get a new version of the Laravel 6 application using the following command. So open your terminal OR the command prompt and run the following command:
composer create-project --prefer-dist laravel/laravel blog
Step 2: Install anhskohbo/no-captcha Package
In this step we have to install anhskohbo / no-captcha via the Composer package manager, hence its terminal and the following fire command:
composer require anhskohbo/no-captcha
After successfully installing the package, we need to add an alias and a service provider.
config/app.php
<?php return [ ..... 'providers' => [ ..... Anhskohbo\NoCaptcha\NoCaptchaServiceProvider::class ], 'aliases' => [ ..... 'NoCaptcha' => Anhskohbo\NoCaptcha\Facades\NoCaptcha::class, ] ]
Step 3: Update Google API Key
In this step, we need to set the Google site key and the secret key. If you don't have the site key and secret key, you can create from here. First click on this link: Recaptcha Administrator
After clicking you will see a nice view and have to register your site link.
Ok, after successful registration you can get the site key and the secret key.
Now open the ENV file and add these two variables.
.env
NOCAPTCHA_SITEKEY=[site-key] NOCAPTCHA_SECRET=[secret-key]
Step 4: Add Route
In this step we need to create routes for the display view and the Ajax method. Open your "route / web.php" file and add the following route.
routes/web.php
Route::get('site-register', 'SiteAuthController@siteRegister'); Route::post('site-register', 'SiteAuthController@siteRegisterPost');
Step 5: Create SiteAuthController
In this step we need to create a new controller like SiteAuthController and insert two methods siteRegister () and siteRegisterPost () into this controller as you can see below:
app/Http/Controllers/SiteAuthController.php
<?php namespace App\Http\Controllers; use Illuminate\Http\Request; class SiteAuthController extends Controller { /** * Create a new controller instance. * * @return void */ public function siteRegister() { return view('siteRegister'); } /** * Create a new controller instance. * * @return void */ public function siteRegisterPost(Request $request) { $this->validate($request, [ 'name' => 'required', 'email' => 'required|email', 'password' => 'required|same:password_confirmation', 'password_confirmation' => 'required', 'g-recaptcha-response' => 'required|captcha', ]); print('done'); } }
Step 6: Create View File
In the last step we create siteRegister.blade.php (resources / views / siteRegister.blade.php) for the design and list all article codes here and place the following code:
resources/views/siteRegister.blade.php
<!DOCTYPE html> <html> <head> <title>Google ReCAPTCHA Form Validation in Laravel 6 Tutorials - Myitbuddies.com</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css" /> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> {!! NoCaptcha::renderJs() !!} </head> <body> <div class="container"> <div class="row"> <div class="col-md-8 col-md-offset-2"> <div class="panel panel-primary"> <div class="panel-heading">Register - Myitbuddies.com</div> <div class="panel-body"> <form class="form-horizontal" role="form" method="POST" action="{{ url('/site-register') }}"> {!! csrf_field() !!} <div class="form-group{{ $errors->has('name') ? ' has-error' : '' }}"> <label class="col-md-4 control-label">Name</label> <div class="col-md-6"> <input type="text" class="form-control" name="name" value="{{ old('name') }}"> @if ($errors->has('name')) <span class="help-block"> <strong>{{ $errors->first('name') }}</strong> </span> @endif </div> </div> <div class="form-group{{ $errors->has('email') ? ' has-error' : '' }}"> <label class="col-md-4 control-label">E-Mail Address</label> <div class="col-md-6"> <input type="email" class="form-control" name="email" value="{{ old('email') }}"> @if ($errors->has('email')) <span class="help-block"> <strong>{{ $errors->first('email') }}</strong> </span> @endif </div> </div> <div class="form-group{{ $errors->has('password') ? ' has-error' : '' }}"> <label class="col-md-4 control-label">Password</label> <div class="col-md-6"> <input type="password" class="form-control" name="password"> @if ($errors->has('password')) <span class="help-block"> <strong>{{ $errors->first('password') }}</strong> </span> @endif </div> </div> <div class="form-group{{ $errors->has('password_confirmation') ? ' has-error' : '' }}"> <label class="col-md-4 control-label">Confirm Password</label> <div class="col-md-6"> <input type="password" class="form-control" name="password_confirmation"> @if ($errors->has('password_confirmation')) <span class="help-block"> <strong>{{ $errors->first('password_confirmation') }}</strong> </span> @endif </div> </div> <div class="form-group{{ $errors->has('g-recaptcha-response') ? ' has-error' : '' }}"> <label class="col-md-4 control-label">Captcha</label> <div class="col-md-6"> {!! app('captcha')->display() !!} @if ($errors->has('g-recaptcha-response')) <span class="help-block"> <strong>{{ $errors->first('g-recaptcha-response') }}</strong> </span> @endif </div> </div> <div class="form-group"> <div class="col-md-6 col-md-offset-4"> <br/> <button type="submit" class="btn btn-primary"> <i class="fa fa-btn fa-user"></i>Register </button> </div> </div> </form> </div> </div> </div> </div> </div> </body> </html>
Now you can just run and check ...
I hope this Google ReCAPTCHA Form Validation Tutorials could help you ...
Thanks.
0 comments:
Post a Comment
Please don't enter any spam link in the comment box.