Yii2 captcha 验证码，点击不刷新，解决方案

虽然目前个人的工作不是程序员，但自己一直对敲代码非常感兴趣；

参加培训班（虽然没有卵用）+自学，差不多快半年了最近学习Yii2框架，使用验证码，坑爹的事情出现了，页面刷新、点击图片验证码都不会刷新；

然而官方文档如下：

虽然自己英文不咋滴，但这句还是能看懂的，大致意思就是“点击图片，加载新的验证码”,然而，按照官方提供的demo，压根没法实现点击更换验证码...... Yii2 captcha 验证码，点击不刷新，解决方案

网上的解决方法如下：

网上的大多数解决方法都是通过修改vendor/yiisoft/yii2/captcha/CaptchaAction.php中的代码来解决，

以下两种方法可以任选其一：

1.修改 getVerifyCode() 方法的参数默认值

将参数$regenerate的默认值由false改为true，这样在不传参数的情况下，程序每次获取验证码时都会重新生成。

2.修改run()方法

......

详细可以查看 http://www.yiichina.com/tutorial/410

就个人而言，感觉直接修改源码，后期维护会非常麻烦......

最后自己研究源码，在 yii\captcha\CaptchaAction 中发现一下说明：
Yii2 captcha 验证码，点击不刷新，解决方案

在controller中，加入'testLimit'=>1, 还是没有用

最后，干脆我自己写了js，完美解决问题。

最终方案：

在view最下方，增加以下代码

<?php
$url = Url::to(['public/captcha','refresh'=>'']);  //验证码请求地址
$script = <<<JS
$("#loginform-verify-image").click(function(){   
    $.get('{$url}',function(res){
       $("#loginform-verify-image").attr('src',res.url);
    })
})
JS;
$this->registerJs($script,5);//注册js代码到<span style="color: rgb(34, 34, 34); font-family: Consolas, 'Lucida Console', monospace;">jQuery(window).load()</span>中
?>

关于验证码请求地址，要加“refresh”参数，具体原因，看以查看一下源码，就明白了；

Yii2 captcha 验证码，点击不刷新，解决方案

全部代码：

view ：

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

<span style="white-space:pre">	</span>'template'=>"<div class=\"row\"><div class=\"col-xs-6\">{input}</div><div class=\"col-xs-6\">{image}</div></div>",
<span style="white-space:pre">	</span>'captchaAction'=>'public/captcha',
        'imageOptions'=>['alt'=>'点击换图','title'=>'点击换图', 'style'=>'cursor:pointer'],
        'options'=>['class'=>'form-control col-lg-6']
])->label('验证码：');
?>

最下面加入

<?php
$url = Url::to(['public/captcha','refresh'=>'']);  //验证码请求地址
$script = <<<JS
$("#loginform-verify-image").click(function(){   
    $.get('{$url}',function(res){
       $("#loginform-verify-image").attr('src',res.url);
    })
})
JS;
$this->registerJs($script,5);//注册js代码到jQuery(window).load()中
?>

model的rules()中添加

['verify', 'captcha','captchaAction'=>'public/captcha'],

Controller的actions中添加：

    public function actions()
    {
        return [
            'captcha' => [
                'class' => 'yii\captcha\CaptchaAction',
                'fixedVerifyCode' => YII_ENV === 'test' ? 'testme' : null,
                'testLimit'=>1, 
                'height' => 34,
                'width' => 80,
                'minLength' => 4,
                'maxLength' => 4
            ],
        ];
    }

完美解决

秒客网

Yii2 captcha 验证码，点击不刷新，解决方案

网上的解决方法如下：

详细可以查看 http://www.yiichina.com/tutorial/410

相关文章