How To Add Google reCAPTCHA v2 In HTML Form Based PHP/Laravel Website

  • 15-07-2022
  • 1463
  • Laravel 9
  • Haresh Chauhan

How To Add Google reCAPTCHA v2 In HTML Form Based PHP/Laravel Website?; Hello Developers, In this post we will teach you how to integrate google reCAPTCHA v2 in your HTML form Based PHP - Laravel website. Also, I will tell you how to generate a site key and site secret key in this tutorial.

What is reCAPTCHA?

The reCAPTCHA will protect your website from fraud and abuse without creating extra function and friction. The reCAPTCHA uses to advanced protection of your website from adaptive advanced challenges to keep malicious software and hackers and robotics engines.

The reCAPTCHA V2 services implementing from the google. This service provides by google to protect against automation and spam by adding inside the form.

This is very easy to integrate Google Recaptcha in your form and all types of input that you want to protect against robotics and automation fillup. This reCAPTCHA must be implemented from both side client and server sides.

This reCAPTCHA with the form filled will send to the server side and check with the google server with our secret key provided by them.

OUTPUT PREVIEW : image

You can see in above image something like this you will get in your site once you integrate google Recaptcha in your site.

So let's start this tutorial by generating the key.

Generate Key

First, We will generate a site key and site secret key for this ReCaptcha integration on our site. Both keys are must be needed else your google Recaptcha will not able to run in your form. Just click on the here given link and follow the next step to generate your key credential. Genrate Recaptch Site Key

Once, you click on the above-given link you will see v3 Admin Console menu in the header section as per in image given.

image

There you can see the PLUS sign at the top right of the site, As in the below image given. Click on this button.

image

After you clicked on the plus button now you can see some details are asking for the generated Recaptcha label, google Recaptcha version, and domain name. Just fill in all the details and submit.

image

Now, You can see your site key and site secret key after submitted. Just copy and paste it into your notepad.

image

How To Add Google reCAPTCHA v3 In HTML Form Based PHP/Laravel Website

Integration In Form

First, We will make an HTML based form and then will add a DIV tag and this div tage will give the class name g-recaptcha and second, we will add attribute data-sitekey in this attribute, we will pass the site key which is provided by google.

Then we will import a script for the google Recaptcha you can see it below example given. After it, all are ready from the client side.

On the server side, we will send a request to the Google server to validate the Recaptcha te request come from the client side. If the request status will return true and the repatch is validated.

index.php 
<?php

if(isset($_POST['submit'])){
  
    $recaptcha_secret = "{SITE SECRATE KEY PUT HERE}";
    $response = file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret=".$recaptcha_secret."&response=".$_POST['g-recaptcha-response']);
    $response = json_decode($response, true);
  
    if($response["success"] === true){

        echo "Form Submit Successfully.";

    }else{

        echo "You are a robot";
    }
}
?>

<html>
  <head>
    <title>reCAPTCHA demo: Webappfix</title>
    <script src="https://www.google.com/recaptcha/api.js" async defer></script>
  </head>
  <body>
    <form action="?" method="POST">
      <div class="g-recaptcha" data-sitekey="{SITE KEY PUT HERE}"></div>
      <br/>
      <input type="submit" value="Submit" name="submit">
    </form>
  </body>
</html>

This is a simple HTML form with integration reCAPTCHA client side and PHP server side.

We always thanks to you for reading our blogs.

dharmesh-image

Dharmesh Chauhan

(Swapinfoway Founder)

Hello Sir, We are brothers origin from Gujarat India, Fullstack developers working together since 2016. We have lots of skills in web development in different technologies here I mention PHP, Laravel, Javascript, Vuejs, Ajax, API, Payment Gateway Integration, Database, HTML5, CSS3, and Server Administration. So you need our service Please Contact Us

haresh-image

Haresh Chauhan

(Co-Founder)
We Are Also Recommending You :