Laravel Validate Form on Submit using Google NoCaptcha reCaptcha Validation Example

Laravel Validate Form on Submit using Google NoCaptcha reCaptcha Validation Example

In this post we will give you information about Laravel Validate Form on Submit using Google NoCaptcha reCaptcha Validation Example. Hear we will give you detail about Laravel Validate Form on Submit using Google NoCaptcha reCaptcha Validation ExampleAnd how to use it also give you demo for it if it is necessary.

Validate Form on Submit using Google reCaptcha Validation Example in Laravel

A Qoutes about using captcha is “Tough on bots and Easy on humans”.You are going to use Google recaptcha so you must know the benefits of using Google recaptcha.

Nomally any captcha protect your websites from spamming.

Google day by day made changes in their library as in past you have to validate via awful distorted text which you have to put in the text box to verify that you are not a robot but now there is a single click to confirm that yes you are not a robot.

reCaptcha is a totally free service that make you websites away from being spam so it means reCaptcha is built only for security purpose.

I am going to use NoCaptcha reCaptcha which is improved version of Captcha announced by Google.

We all know that when Google announce improved version then definitely they will put some great benefits.

In Laravel, There are so many packages to use Google NoCaptcha reCaptcha.

Almost every websites using captcha for security reason either in contact form or in register form.

Let’s start with anhskohbo/no-captcha packages that is very popular now a days. As I told you there are many packages are available like buzz/laravel-google-captcha and google/recaptcha you can use any one of them.

Step1: anhskohbo/no-captcha package installation

I will recommend Composer that is widely used as a dependecy manager for PHP packages. To add this dependency using the command, run following command from your project directory.

composer require anhskohbo/no-captcha

Now add the service provider to the providers array in following path config/app.php

config/app.php

AnhskohboNoCaptchaNoCaptchaServiceProvider::class

Step2: Add NOCAPTCHA_SECRET and NOCAPTCHA_SITEKEY

Add these line in your .env file

NOCAPTCHA_SECRET=[secret-key] - 6LeIxAcTAAAAAGG-vFI1TnRWxMZNFuojJ4WifJWe
NOCAPTCHA_SITEKEY=[site-key] - 6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI

To get secret-key and site-key click here Recaptcha Admin

For now Google provide dummy Site key and Secret key. All verification requests will pass by using these keys in your website and No Catpcha will be display on your website but this will be for only testing purpose.

Step3: Add Route and Controller functions

  1. Route::get('captcha-form-validation',array('as'=>'google.get-recaptcha-validation-form','uses'=>'FileController@getCaptchaForm'));
  2. Route::post('captcha-form-validation',array('as'=>'google.post-recaptcha-validation','uses'=>'FileController@postCaptchaForm'));
Route::get('captcha-form-validation',array('as'=>'google.get-recaptcha-validation-form','uses'=>'FileController@getCaptchaForm')) ;Route::post('captcha-form-validation',array('as'=>'google.post-recaptcha-validation','uses'=>'FileController@postCaptchaForm')) ;

Add these two methods in your controller.

  1. public functiongetCaptchaForm(){
  2. returnview('files.captchaform');
  3. }
  4. public functionpostCaptchaForm(Request $request){
  5. $this->validate($request,[
  6. 'name'=>'required',
  7. 'email'=>'required|email',
  8. 'phone'=>'required|numeric|digits:10',
  9. 'details'=>'required',
  10. 'g-recaptcha-response'=>'required|captcha',
  11. ]);
  12. }
 public function getCaptchaForm(){    return view('files.captchaform'); } public function postCaptchaForm(Request $request){     $this->validate($request, [          'name' => 'required',          'email'=>'required|email',          'phone'=>'required|numeric|digits:10',          'details' => 'required',          'g-recaptcha-response' => 'required|captcha',      ]); }

Step4: Add Blade File

Now create a blade file where you have to validate your form using Google no-captcha recaptcha

resources/views/files/captchaform.blade.php

  1. <divclass="panel panel-primary">
  2. <divclass="panel-heading">Google reCaptcha Validation Example</div>
  3. <divclass="panel-body">
  4. <divclass="row">
  5. <divclass="col-xs-12 col-sm-12 col-md-6 col-md-offset-3">
  6. {!! Form::open(array('route' => 'google.post-recaptcha-validation','method'=>'POST','files'=>true,'id'=>'myform')) !!}
  7. <divclass="col-xs-12 col-sm-12 col-md-12">
  8. <divclass="form-group">
  9. <strong>Name:</strong>
  10. {!! Form::text('name', null, array('placeholder' => 'Name','class' => 'form-control')) !!}
  11. {!! $errors->first('name', '<pclass="alert alert-danger">:message</p>') !!}
  12. </div>
  13. </div>
  14. <divclass="col-xs-12 col-sm-12 col-md-12">
  15. <divclass="form-group">
  16. <strong>Email:</strong>
  17. {!! Form::text('email', null, array('placeholder' => 'Email','class' => 'form-control')) !!}
  18. {!! $errors->first('email', '<pclass="alert alert-danger">:message</p>') !!}
  19. </div>
  20. </div>
  21. <divclass="col-xs-12 col-sm-12 col-md-12">
  22. <divclass="form-group">
  23. <strong>Phone:</strong>
  24. {!! Form::text('phone', null, array('placeholder' => 'Mobile No','class' => 'form-control')) !!}
  25. {!! $errors->first('phone', '<pclass="alert alert-danger">:message</p>') !!}
  26. </div>
  27. </div>
  28. <divclass="col-xs-12 col-sm-12 col-md-12">
  29. <divclass="form-group">
  30. <strong>Details:</strong>
  31. {!! Form::textarea('details', null, array('placeholder' => 'Details','class' => 'form-control','style'=>'height:100px')) !!}
  32. {!! $errors->first('details', '<pclass="alert alert-danger">:message</p>') !!}
  33. </div>
  34. </div>
  35. <divclass="col-xs-12 col-sm-12 col-md-12">
  36. <divclass="form-group">
  37. <strong>Captcha:</strong>
  38. {!! app('captcha')->display() !!}
  39. {!! $errors->first('g-recaptcha-response', '<pclass="alert alert-danger">:message</p>') !!}
  40. </div>
  41. </div>
  42. <divclass="col-xs-12 col-sm-12 col-md-12 text-center">
  43. <buttontype="submit"class="btn btn-primary">Submit</button>
  44. </div>
  45. {!! Form::close() !!}
  46. </div>
  47. </div>
  48. </div>
  49. </div>
 <div >    <div >Google reCaptcha Validation Example</div>      <div >            <div >                <div >            {!! Form::open(array('route' => 'google.post-recaptcha-validation','method'=>'POST','files'=>true,'id'=>'myform')) !!}                             <div >                    <div >                        <strong>Name:</strong>                        {!! Form::text('name', null, array('placeholder' => 'Name','class' => 'form-control')) !!}                        {!! $errors->first('name', '<p >:message</p>') !!}                    </div>                </div>                 <div >                    <div >                        <strong>Email:</strong>                        {!! Form::text('email', null, array('placeholder' => 'Email','class' => 'form-control')) !!}                        {!! $errors->first('email', '<p >:message</p>') !!}                    </div>                </div>               <div >                    <div >                        <strong>Phone:</strong>                        {!! Form::text('phone', null, array('placeholder' => 'Mobile No','class' => 'form-control')) !!}                        {!! $errors->first('phone', '<p >:message</p>') !!}                    </div>                </div>                <div >                    <div >                        <strong>Details:</strong>                        {!! Form::textarea('details', null, array('placeholder' => 'Details','class' => 'form-control','style'=>'height:100px')) !!}                        {!! $errors->first('details', '<p >:message</p>') !!}                    </div>                </div>                 <div >                    <div >                        <strong>Captcha:</strong>                        {!! app('captcha')->display() !!}                        {!! $errors->first('g-recaptcha-response', '<p >:message</p>') !!}                    </div>                </div>                <div >                        <button type="submit" >Submit</button>                </div>                      {!! Form::close() !!}            </div>           </div>        </div>    </div>

Don’t forget to add script file in head section.

  1. <script src="https://www.google.com/recaptcha/api.js"></script>
<script src="https://www.google.com/recaptcha/api.js"></script>

Now try this code in your application to validate your form using Google Nocapcha reCaptcha.

Show Demo

Hope this code and post will helped you for implement Laravel Validate Form on Submit using Google NoCaptcha reCaptcha Validation Example. if you need any help or any feedback give it in comment section or you have good idea about this post you can give it comment section. Your comment will help us for help you more and improve us. we will give you this type of more interesting post in featured also so, For more interesting post and code Keep reading our blogs

For More Info See :: laravel And github

Leave a Comment

Your email address will not be published. Required fields are marked *

  +  37  =  45

We're accepting well-written guest posts and this is a great opportunity to collaborate : Contact US