reCAPTCHA: The FREE anti-abuse service

What is reCAPTCHA?

reCAPTCHA is a free service that protects your site from spam and abuse. It uses advanced risk analysis engine to tell humans and bots apart. With the new API, a significant number of your valid human users will pass the reCAPTCHA challenge without having to solve a CAPTCHA (Seeblog for more details). reCAPTCHA comes in the form of a widget that you can easily add to your blog, forum, registration form, etc.

Hundreds of millions of CAPTCHAs are solved by people every day. reCAPTCHA makes positive use of this human effort by channeling the time spent solving CAPTCHAs into digitizing text, annotating images, building machine learning datasets. This in turn helps preserve books, improve maps, and solve hard AI problems. Learn how reCAPTCHA works and join our forum.

Featured Video

Displaying the widget

This page explains how to display and customize the reCAPTCHA widget on your webpage.

To display the widget, you can either:

See Configurations to learn how to customize your widget. For example, you may want to specify the language or theme for the widget.

See Verifying the user's response to check if the user successfully solved the CAPTCHA.

Automatically render the reCAPTCHA widget

The easiest method for rendering the reCAPTCHA widget on your page is to include the necessary JavaScript resource and a g-recaptcha tag. Theg-recaptcha tag is a DIV element with class name 'g-recaptcha' and your site key in the data-sitekey attribute:

<html>
  <head>
    <title>reCAPTCHA demo: Simple page</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="your_site_key"></div>
      <br/>
      <input type="submit" value="Submit">
    </form>
  </body>
</html>

The script must be loaded using the HTTPS protocol and can be included from any point on the page without restriction.

Explicitly render the reCAPTCHA widget

Deferring the render can be achieved by specifying your onload callback function and adding parameters to the JavaScript resource.

  1. Specify your onload callback function. This function will get called when all the dependencies have loaded.
    <script type="text/javascript">
      var onloadCallback = function() {
        alert("grecaptcha is ready!");
      };
    </script>
  2. Insert the Javascript resource, setting the onload parameter to your onload callback function and the render parameter to explicit.
    <script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit" async defer></script>
    When your onload callback function is executed, you can call the grecaptcha.render method from the Javascript API.

How to setup google reCAPTCHA ?

1) Get reCaptcha Key ====> Click here to create a Google reCaptcha application.

2) reCaptcha Key

About The Massive Technolab

Avatar
Who We Are

Massive Technolab is a Leading IT services Company in India that expertise in web Development, Web Design and SEO at affordable rates.

Leave a Comment

comments powered by Disqus