Main Content
captcha dialog box

How to Stop SPAM with Drupal 8's Recaptcha module

Have you ever tried logging in or registering to a website and you were asked to identify some distorted numbers and letters and type it into the provided box? That is the CAPTCHA system.

The CAPTCHA helps to verify whether your site's visitor is an actual human being or a robot. Not a robot like you see in the Terminator movie but an automated software to generate undesired electronic messages (or content). In short, CAPTCHA protects you from SPAM.
 

Distorted texts and numbers, for example, could not be recognized by bots so by providing this we are sure that only a human can log in or register.


This works! But there are some downfalls to this. For one, it's not user-friendly to visitors who are visually impaired. Reading distorted numbers and letters can be annoying to regular users, how much more to a user with a visual disability. The last thing we want from our visitors' is form abandonment, that is, leaving without even the chance to enter.
 

The solution? reCAPTCHA!
 

Drupal's reCAPTCHA module uses the Google reCAPTCHA to improve the CAPTCHA system. The reCAPTCHA module is a very efficient addon to the original CAPTCHA module.

With reCAPTCHA, we have the choice to provide a simple checkbox that asks our users if they are a robot or not. this is so much easier than asking our users to read distorted characters. We can also provide several random images and ask our users to check a specific image. This kind of test could not be passed by a robot, but we humans can!

Why trouble with bots? You may ask. The CAPTCHA system provides security, including but not limited to:

                -  Preventing Comment Spam in Blogs.
                -  Protecting Website Registration.
                -  Protecting Email Addresses From Scrapers.
                -  Online Polls.
                -  Preventing Dictionary Attacks.
                -  Search Engine Bots
                -  Worms (malware computer program) and SPAMs (undesired messages/content).

So how do we set up reCAPTCHA for our forms? Read along for an easy and detailed guide in setting up reCAPTCHA for your forms. this tutorial provides screenshots of every of every step of the way.
 

Install
 

Download and install CAPTCHA and reCAPTCHA module.

Using your favorite installation mode the Drupal UI, copy/paste from drupal.org, Drush, or Composer. Just remember that to use reCAPTCHA, you need the CAPTCHA module.

If your site is set using the PHP dependency manager called composer (like we do at Promet Source), add reCAPTCHA and the CAPTCHA module will be added automatically as dependencies:

$ composer require drupal/recaptcha


 

Enable
 

With Drush, you can enable the reCAPTCHA module by running the command in your terminal.

$ drush en recaptcha

Drush is fantastic to interact with Drupal and work faster. Learn more: Drush Made Simple).

You can also enable the module in the UI at "/admin/modules".

Search for Recaptcha, Click the checkbox and click 'install'.
 

Enabled reCAPTCHA module


Configure
 

Go to "admin/config" and choose CAPTCHA module settings.
 

CAPTCHA module settings


In the form protection default challenge type drop-down, choose reCAPTCHA from module reCAPTCHA. Don't forget to click 'Save configuration'.
 

CAPTCHA settings


After saving, click the reCAPTCHA tab.
You will be asked for the 'Site key' and 'Secret key'.
Click on the link Register for the reCAPTCHA, you will then be automatically redirected to Google.

Register your website for reCAPTCHA

Write your domain name in 'domains'.
 

A screenshot of the form where the site has to be registered for reCAPTCHA


You will be provided with the site key and secret key. Go back to "admin/config/people/captcha/recaptcha" and fill up the "Site key" in the general settings.

Click save.
 

CAPTCHA keys

Then go to CAPTCHA Points.

Choose which form you would like to use your reCAPTCHA.

TEST!!

To test, simply open your website and try visiting the form where you enabled the reCAPTCHA.

In this tutorial, the form that I choose to use reCAPTCHA is the login form.

reCAPTCHA displayed in a login page

Additional step: For local testing ONLY

If you want to do the above steps in your local environment, you have to disable the domain name validation in your reCAPTCHA configuration in google.com

Click the Advance settings and disable the domain name validation.
 

CAPTCHA for local testing


Don't forget to test by accessing your form in an incognito browser.

And there you have it, reCAPTCHA configured! Your Drupal 8 project is now protected by Google's reCAPTCHA system.

Say no to bots, yes to human...

Questions?
Drop them in the comments section below this article :)

Special thanks to Luc Bezier for contributing to this post before publication.