Yogesh Chauhan's Blog

How to add recaptcha version 3 to PHP website?

in PHP on March 19, 2021

You are going to need recaptcha keys to get started on this. Get it from Google here.

Step 1: JavaScript

Add this JavaScript code between your head tags using script tag or include a seperate .js file in head tags.



grecaptcha.ready(function () {
  grecaptcha
    .execute("YOUR_RECAPTCHA_SITE_KEY", { action: "contact" })
    .then(function (token) {
      var recaptchaResponse = document.getElementById("recaptchaResponse");
      recaptchaResponse.value = token;
    });
});


Step 2: HTML form

Add this line after your submit button but before the form tag ends.



 <form>
    ...
    ...
   <button type="submit">Submit</button>
   <input type="hidden" name="recaptcha_response" id="recaptchaResponse">
 </form>


Step 3: PHP

Use this code for server side integration.



<?php // Check if form was submitted:
if ($_SERVER['REQUEST_METHOD'] === 'POST' &#038;&#038; isset($_POST['recaptcha_response'])) {

    // Build POST request:
    $recaptcha_url = 'https://www.google.com/recaptcha/api/siteverify';
    $recaptcha_secret = 'YOUR_RECAPTCHA_SECRET_KEY';
    $recaptcha_response = $_POST['recaptcha_response'];

    // Make and decode POST request:
    $recaptcha = file_get_contents($recaptcha_url . '?secret=' . $recaptcha_secret . '&#038;response=' . $recaptcha_response);
    $recaptcha = json_decode($recaptcha);

    // Take action based on the score returned:
    if ($recaptcha->score >= 0.5) {
        // Verified - send email
    } else {
        // Not verified - show form error
    }

} ?>


Credit: stevencotterill. Google has nice guides for client side and server side integration as well.


Most Read

#1 How to check if radio button is checked or not using JavaScript? #2 How to add Read More Read Less Button using JavaScript? #3 Solution to “TypeError: ‘x’ is not iterable” in Angular 9 #4 How to uninstall Cocoapods from the Mac OS? #5 PHP Login System using PDO Part 1: Create User Registration Page #6 How to Use SQL MAX() Function with Dates?

Recently Posted

#Jan 17 4 advanced ways to search Colleague #Jan 16 Colleague UI Basics: The Search Area #Jan 16 Colleague UI Basics: The Context Area #Jan 16 Colleague UI Basics: Accessing the user interface #Jan 14 How to display a student’s individual transcript in Colleague? #Jan 11 How to install PuTTY on a MacOS?
You might also like these
JavaScript Number MethodsJavaScriptCSS align-items property examplesCSSHow to create a flip effect with CSS?CSSSolution for Xcode 11 Command PhaseScriptExecution failed with a nonzero exit code errorMiscellaneousIN and BETWEEN Operators in SQLSQL/MySQLHow to add a select dropdown in React?ReactDROP DATABASE (remove a database) from PostgresPostgresHow to render lists inside a component in React?ReactHow to make a curtain slider using jQuery and CSS?CSSHow to use $IF operator in Envision Basic?Envision BasicCSS Attribute SelectorsCSSWhat happened to your Google Analytics Tracking ID, can’t find it?Miscellaneous