Google reCAPTCHA V2 widget for Yii Framework 1.

Author Poliakov Vladimir.
Recently we needed integrate recaptcha to login and registration forms. Project was on Yii 1 framework. These forms were show in defferent modal windows. All most realized widgets reCaptcha v2 for Yii1 were for “single form” mode with tag. And we decided to fix the situation - create the universal widget.

In official docs google reCaptcha has 2 method for render widget: onload and explicit. Standart render “onload” in tag with class ‘g-recaptcha’ (1):

    <?php

    Yii::import('application.extensions.reCaptcha2.SReCaptcha');
    $this->widget('SReCaptcha',
      [
            'name' => 'reCaptcha', 
            'siteKey' => Yii::app()->params['reCaptcha2PublicKey'], 
            'widgetOptions' => ['class' => 'col-lg-3'],
            'theme' => SReCaptcha::THEME_DARK,
            'size' => SReCaptcha::SIZE_COMPACT,
            'jsCallback' => 'console.log("reCaptcha is ready!");console.log(response);',
            'jsExpiredCallback' => 'console.log("reCaptcha is expired!");'
      ]
    );

Description: name - Prefer use name like “reCaptcha” and this is required parameter. siteKey - Public key reCaptcha and this is required parameter. widgetOptions - Additional html widget options, such as class. theme - Recaptcha themes (dark or light). size - Recaptcha size (normal or compact). jsCallback - Will call js code after successfull captcha response. Parameter “response” is the key (g-recaptcha-response) will be send to verify server. jsExpiredCallback - Js code if reCaptcha is expired.

Ok. Code Example if you want use captcha in Active Form with model (2):

    <?php

    $form->widget('application.extensions.reCaptcha2.SReCaptcha',
        [
            'name' => 'reCaptcha', //is requred
            'siteKey' => Yii::app()->params['reCaptcha2PublicKey'], //is requred
            'model' => $model,
            //'attribute' => 'reCaptcha' //if we use model name equal attribute or customize attribute
        ]
    );

You may use params like descripted above (1).

In case render “explicit” needed add parameter ‘render’ and see params for “grecaptcha.render parameters”:

        <form method="POST" action="/login">
            LOGIN FORM:
            Username:<input type="text" name="Login[username]">
            Password:<input type="password" name="Login[password]">
            <div id="reCaptchaLogin"></div>
        </form>
        
        <form method="POST" action="/reg">
            REGISTRATION FORM:
            Username: <input type="text" name="Reg[username]">
            Password: <input type="password" name="Reg[password]">
            Confirm Password: <input type="password" name="Reg[confirm]">
            <div id="reCaptchaReg"></div>
        </form>

    $this->widget('application.extensions.reCaptcha2.SReCaptcha',
        [
            'siteKey' => Yii::app()->params['reCaptcha2PublicKey'],
            'render' => [
                'reCaptchaLogin' => [
                    'callback' => 'console.log("#reCaptchaLogin is ready!");',
                    'theme' => 'dark',
                    'expired-callback' => 'console.log("#reCaptchaLogin is expired!");'
                ],
                'reCaptchaReg' => [
                    'size' => 'compact',
                    'callback' => 'console.log("#reCaptchaReg is ready!");console.log(response);',
                ]
            ],
        ]
    );
    

And don’t forget add validator, for example code for your model:

    public $reCaptcha;
   //...
   
   public function rules()
   {
     return [
         // ...
         // secret is required
         ['reCaptcha', 'application.extensions.reCaptcha2.SReCaptchaValidator', 'secret' => Yii::app()->params['reCaptcha2PrivateKey'],'message' => 'The verification code is incorrect.']
         // ...
     ];
   }

That’s all. I hope, the widget will be useful. Download