codervlogortex

How to Integrate Google reCAPTCHA v2 with HTML and PHP?

Step by step tutorial with sample code on how to integrate Google reCAPTCHA v2 (I'm not robot) to your HTML forms and verifying the response with PHP.

What is Google reCAPTCHA?

reCAPTCHA is a security measure developed by Google that helps protect websites and online services from automated abuse such as spam, account theft, and other types of online fraud.

It works by presenting users with problems that are difficult for automated bots to solve, but easy for humans to solve.

The most common form of Google reCAPTCHA is the "I'm not a robot" checkbox that appears on many websites. When a user clicks a checkbox, Google analyzes the user's behavior to determine if it's a human or a bot.

Additional challenges are presented when Google suspects that a user may be a bot.

Checkout How to Integrate Invisible reCAPTCHA v3 with HTML and PHP?

These are the steps to integrate Google reCAPTCHA v2 into your HTML and PHP website.

Step 1: Register for reCAPTCHA

You need to register a new site in the Google reCAPTCHA console by visiting this link https://www.google.com/recaptcha/admin/create.

  • Give your site's name in the Label field.
  • Choose reCAPTCHA v2, and by default, the "I'm not a robot" checkbox option is selected. Leave it like that unless you want to choose a different widget.
  • Add your website url under the "Domains" section; you can add multiple domains by hitting enter.

Register new site in reCAPTCHA

  • Make sure to check the Terms of Service.
  • Leave the Send alerts to owners checkbox checked, unless you don't want to receive those alerts.
  • Hit Submit.

Register new site in reCAPTCHA

Step 2: Copy the Keys

Once your site is added, you will see SITE KEY and SECRET KEY generated for you; make sure to copy both and go to the Analytics page or close the window.

reCAPTCHA keys

Step 3: Client Side Integration

Add the recaptcha API script at the bottom of the page before closing the </body> tag.

Create a simple form and a div with the "g-recaptcha" class. This is where the reCAPTCHA widget will be rendered.

<body>
    <form action="action.php" method="POST">
        <div>
            <input type="email" name="email" placeholder="Email">
        </div>
        <div>
            <div class="g-recaptcha" data-sitekey="6Lc1PxElAAAAABQbBMhv0U5JnHrPy7lQayGK06vi"></div>
        </div>
        <div>
            <button>Submit</button>
        </div>
    </form>
    <script src="https://www.google.com/recaptcha/api.js"></script>
</body>

Step 4: Server Side Integration

The CAPTCHA value will be sent in a POST variable named "g-recaptcha-response".

We will have to verify its value with the reCAPTCHA API using php curl. Make sure PHP curl is enabled on your server.

If a success response is received, go ahead and process the further actions; otherwise, return an "Invalid CAPTCHA" error to the user.

<?php
    function reCaptcha($recaptcha){
        $secret = "6Lc1PxElAAAAALss17mz0Cz_eoVg-LMohwU67ddN";
        $ip = $_SERVER['REMOTE_ADDR'];

        $postvars = array("secret"=>$secret, "response"=>$recaptcha, "remoteip"=>$ip);
        $url = "https://www.google.com/recaptcha/api/siteverify";

        $ch = curl_init();
        curl_setopt($ch, CURLOPT_URL, $url);
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
        curl_setopt($ch, CURLOPT_TIMEOUT, 10);
        curl_setopt($ch, CURLOPT_POSTFIELDS, $postvars);
        $data = curl_exec($ch);
        curl_close($ch);

        return json_decode($data, true);
    }

    $recaptcha = $_POST['g-recaptcha-response'];

    $res = reCaptcha($recaptcha);

    if($res['success']){
        $email = $_POST['email'];
        echo "Success ".$email;
    }
    else{
        echo "CAPTCHA Failed";
    }
?>

Related Posts