How to Add Google reCAPTCHA in Yii 2

PHP Packages for yii2-reCAPTCHA help you identify damaging traffic on your site without client interaction. CAPTCHA is the collective name for several techniques and tests that prevent spammers, bots, and automated services from adding false or malicious data to a website’s database. In this tutorial, you will learn how to add Google’s reCAPTCHA to a contact form. This service provides images of words that challenge any robotic Optical Character Recognition (OCR) software.

Before starting, make sure you have installed and setup Yii2 application on Cloudways. Once done, start by signing up for the API key of Google reCAPTCHA.

Add Google reCAPTCHA in Yii2

So, without further ado, let’s move on to the process of how you can add a Google reCaptcha to your application,

Creating Google reCAPTCHA using API Key

Go to the official Google reCAPTCHA site and click on Get reCAPTCHA.

Once done, click on Register. The website will now offer a Site Key and a Secret Key. Both these keys will be used in this tutorial.

It is now time to add reCAPTCHA to the Yii2 app.

Adding the reCAPTCHA Extension for Yii2

The first step is to add the reCAPTCHA extension. For this, access the Yii2 application using the SSH Terminal provided by the Cloudways. (You can also use PuTTY.)

Run the following command to add the extension:

composer require --prefer-dist "himiklab/yii2-recaptcha-widget" "*"

You will see the following screen as the extension is installing:

Once installed, the next step is to properly configure the extension.

Go to the config folder and open web.php located inside components folder. Add the following code to DB:

'reCaptcha' => [

       'name' => 'reCaptcha',

       'class' => 'himiklab\yii2\recaptcha\ReCaptcha',

       'siteKey' => 'sitekey',

       'secret' => 'secret key',

       ],

Where indicated, add your site and secret keys provided by the Google reCAPTCHA and save the file.

Adding the reCAPTCHA to the Contact Form

Now, you can add the authentication method to contact forms that come with Yii 2 Basic.

Go to the view/site and open contact.php. In this file, find the following block of code:

<?= $form->field($model, 'verifyCode')->widget(Captcha::className(), [

                       'template' => '<div class="row"><div class="col-lg-3">{image}</div>
<div class="col-lg-6">{input}</div></div>',

                   ]) ?>

Now replace it with this code:

<?= $form->field($model, 'reCaptcha')->widget(\himiklab\yii2\recaptcha\ReCaptcha::className()) ?>

Next, add a rule to the contact forms’ model. Go to models and open ContactForm.php. In rules(), add the new rule for reCAPTCHA:

public function rules()
{
return [
// name, email, subject and body are required
[['name', 'email', 'subject', 'body','reCaptcha'], 'required'],
// email has to be a valid email address
['email', 'email'],
// verifyCode needs to be entered correctly
['reCaptcha', \himiklab\yii2\recaptcha\ReCaptchaValidator::className(), 'secret' => '6LeTXQgUAAAAALExcpzgCxWdnWjJcPDoMfK3oKGi']

];
}

Testing

You will notice that reCAPTCHA replaces the CAPTCHA. Use the form to observe if it’s validating correctly or not.

Conclusion

reCAPTCHA is a free service from Google that makes a difference when it comes to securing websites from spam and manhandling. A “CAPTCHA” is a Turing test to tell humans and bots apart. By including reCAPTCHA to a website, you’ll block automated programs whilst helping your welcome clients to enter with ease.

The idea behind writing this was to demonstrate how you could replace CAPTCHA that comes preinstalled in Yii2 with reCAPTCHA, and improve your security. Feel free to leave your comments if you have any questions regarding the code or think that you can improve on them.

Inshal Ali

Inshal is a Content Marketer at Cloudways. With background in computer science, skill of content and a whole lot of creativity, he helps business reach the sky and go beyond through content that speaks the language of their customers. Apart from work, you will see him mostly in some online games or on a football field.

Get Connected on: Twitter Community Forum