recaptchayii-extensionsyii-componentsyii1.x

Google reCAPTCHA v2 on Yii1.1.6 not shown


I'm trying to make google reCaptcha on my projects that used Yii 1.1.6.

And I already follow this documentation https://github.com/dakiquang/yiiReCaptcha. But my google reCaptcha is not shown.

reCaptcha not shown

Anybody can help, please?

This is my loginForm.php models

class LoginForm extends CFormModel
{
    public $username;
    public $password;
    public $rememberMe;
    public $verifyCode;

    private $_identity;

    /**
     * Declares the validation rules.
     * The rules state that username and password are required,
     * and password needs to be authenticated.
     */
    public function rules()
    {
        return array(
            // username and password are required
            array('username, password', 'required'),
            // rememberMe needs to be a boolean
            array('rememberMe', 'boolean'),
            // password needs to be authenticated
            array('password', 'authenticate'),
            array('verifyCode', 'required'),
            array('verifyCode', 'ext.yiiReCaptcha.ReCaptchaValidator'),
        );
    }

    /**
     * Declares attribute labels.
     */
    public function attributeLabels()
    {
        return array(
            'username' => 'Email',
            'password' => 'Password',
            'verifyCode' => 'Verification Code',
            'rememberMe' => 'Remember me',
        );
    }
}

and this is my login view login.php

<div class="form-group has-feedback">
          <?php
          $this->widget('ext.yiiReCaptcha.ReCaptcha', array(
            'model'     => $model,
            'attribute' => 'verifyCode',
          ));
          ?>
</div>

also i already changed the main.php on protected/config

'components' => array(
        'reCaptcha' => array(
            'name' => 'reCaptcha',
            'class' => 'ext.yiiReCaptcha.ReCaptcha',
            'key' => 'my-key-in-here',
            'secret' => 'my-key-in-here',
        ),
)

Please, anybody can solve this? Thank you before.


Solution

  • At the last, I use a stupid way to solve this issue. So I add this code <script src="https://www.google.com/recaptcha/api.js" async defer></script> on above of form. And using this code <div class="g-recaptcha" data-sitekey="6LddDZgbAAAAAArLBzXYH0RQ7MMExsp4fbmNVhNf"></div> to render the captcha.

    And it worked!