yii2之使用验证码

yii2集成了许多基础的功能，验证码也在其中，但是官方文档对验证码的介绍使用很少。
在yii2中，验证码这一功能被当作是widgets，其使用有以下几个步骤:

步骤1：

captcha在控制其中是作为一个独立动作来使用，即在控制器中重写actions方法：

public function actions()
    {
        return [
            'error' => [
                'class' => 'yii\web\ErrorAction',
            ],
            'captcha' => [
                'class' => 'yii\captcha\CaptchaAction',
                'maxLength'=>4,
                'minLength'=>4,
                'padding'=>5,
                'height'=>39,
                'width'=>100,
                'offset'=>3,
            ],
        ];
    }

在这里注册了两个独立动作，一个是error，一个就是我们需要captcha，里面有多个参数，其中最重要的就是class，它指明captcha的位置，其余参数及解释点击此处：

参数详解

步骤2：

在控制器actions中注册了captcha方法后，在表单对应的模型中添加captcha字段。

public $captcha = null;//这里是为模型添加一个验证码字段，用来保存前端传来的验证码值
 public function rules()
    {
        return [
            ['username','required','message'=>'用户名不能为空'],
            ['password','required','message'=>'密码不能为空'],
            ['password','validatePass'],
            ['captcha','required','message'=>'验证码不能为空'],  //必须输入验证码      
            ['captcha','captcha','captchaAction'=>'admin/login/captcha','message'=>'验证码不正确']
        ];
    }

验证码验证器后面可以根三个选项：
caseSensitive：对验证码的比对是否要求大小写敏感。默认为 false。

captchaAction：指向用于渲染 CAPTCHA 图片的 CAPTCHA action 的 路由。默认为 ‘site/captcha’。 （此选项必填，不然前台可能无法生成验证码，并且路由要和当前控制器所在路由一致，比如现在处于admin模块/login控制器，那么填入的内容就是’admin/login/captcha’）

skipOnEmpty：当输入为空时，是否跳过验证。 默认为 false，也就是输入值为必需项。

步骤3：

在前台生成验证码，有两种方法
第一种：

    <?php echo Captcha::widget()?>

在widget可以填入相关配置参数，具体介绍留到第二种方法。同时推荐第二种方法。

第二种：

            <?php echo $form->field($model, 'captcha')->widget(Captcha::className(), [
                'captchaAction' => 'login/captcha',
                'options' => [
                    'class' => 'input-text size-L',
                    'style' => 'width:150px;',
                    'placeholder' => '输入验证码',
                ],
                'template' => '
                   {input}&nbsp;&nbsp;{image}
                   ',
                'imageOptions' => [
                    'style' => '',
                ]
            ])->label('<i class="Hui-iconfont">验证码</i>') ?>

相关的配置就填写在第二个参数里
共有4个参数可填写
captchaAction：生成验证码图片的路由 注意：这个必须指定且必须与视图所在方法的路由一致，比如现在处于admin模块/login控制器/login方法，那么填入的内容就是’login/captcha’，省略掉模块id。
imageOptions:设置生成的验证码图片的相关属性，有width、height、font、offset等等
options：与验证码图片绑定的类型为text的input输入框的相关属性
template:模板参数

至此验证码调用完成。

注意，使用验证码的时候，视图文件中必须包含$this->beginPage(),$this->head(),$this->beginBody(),$this->endBody(),$this->endPage。否则就不能实现验证码的点击刷新功能。

在使用过程中发现，通过F5刷新页面，填入验证码后可以提交表单数据到后台，但是通过点击图片刷新验证码后，点击提交按钮会提示验证码错误。经过抓包测试后，推断得出可能是ActiveForm开启了前台js验证功能，点击图片刷新后，是因为没能通过js验证，导致http请求被中断。至于为什么会提示验证码错误暂时没找到原因。希望大神指点一下。 解决方法是在

            <?php $form = ActiveForm::begin([
                'enableClientValidation' => false,
                'options' => ['class' => 'form form-horizontal'],
                'action' => ['login/login'],
                'fieldConfig' => [
                    'template' => '<div class="row cl">
                                {label}
                                <div class="formControls col-xs-8">
                                    {input}{error}
                                </div>
                            </div>',
                    'labelOptions' => ['class' => 'form-label col-xs-3']
                ]
            ]); ?>

开始动态表单的时候，关掉前台验证功能

'enableClientValidation' => false