解决YII2验证码不刷新问题

原文:https://www.fanhaobai.com/2017/06/yii-captcha.html

在 Yii 2 中的验证码功能的确很方便,但是会存在刷新页面并不会刷新验证码的现象,不知道作者这么做有什么意图?在实际应用中,有较多的场景需要刷新页面并刷新验证码,这里在不修改框架源码的情况下,给出了可供参考的解决办法。

抛出问题

示例中的验证码配置如下:

class SiteController extends Controller
{
    public function actions()
    {
        return [
            'captcha' => [
                'class' => 'yii\captcha\CaptchaAction',
                'testLimit' => 1,
                'minLength' => 6,
                'maxLength' => 6,
            ],
        ];
    }
}

页面刷新验证码不刷新

通过 Widgets 渲染出验证码,连续刷新页面多次,验证码并未刷新。

点击刷新发送两次请求

点击验证码,可以刷新验证码,交互流程如下图所示。

第 1 次请求只返回获取新验证码的地址,响应内容如下:

{
    hash1: 654,
    hash2: 654,
    url: "/index.php?r=site/captcha&v=594aa9aa20d37"
}

第 2 次请求新验证码地址,才能获取到新的验证码。共发送 2 次请求,本可以 1 次请求解决的问题。可见,刷新页面不刷新验证码的问题也可以通过这种方式解决。

分析问题

至于为什么直接刷新页面没有刷新验证码,而通过点击验证码就能刷新验证码呢?先分析源码。

class CaptchaAction extends Action
{
    /**
     * The name of the GET parameter indicating whether the CAPTCHA image should be regenerated.
     */
    const REFRESH_GET_VAR = 'refresh';
    ... ...
    
    public function run()
    {
        if (Yii::$app->request->getQueryParam(self::REFRESH_GET_VAR) !== null) {
            // AJAX request for regenerating code
            $code = $this->getVerifyCode(true);
            Yii::$app->response->format = Response::FORMAT_JSON;
            return [
                'hash1' => $this->generateValidationHash($code),
                'hash2' => $this->generateValidationHash(strtolower($code)),
                // we add a random 'v' parameter so that FireFox can refresh the image
                // when src attribute of image tag is changed
                'url' => Url::to([$this->id, 'v' => uniqid()]),
            ];
        } else {
            $this->setHttpHeaders();
            Yii::$app->response->format = Response::FORMAT_RAW;
            return $this->renderImage($this->getVerifyCode());
        }
    }
}

通过源码可以看出,请求时携带 refresh 字段,即认为是 AJAX 请求,并以 JSON 格式返回新的验证码地址;如果没有携带该字段,则直接渲染验证码图片。那么,为什么携带 refresh 字段请求后再直接请求验证码,就会刷新验证码呢?2 个流程分支中都调用了 getVerifyCode() 方法,但是参数并不同。查看 getVerifyCode() 方法源码:

/**
 * Gets the verification code.
 * @param bool $regenerate whether the verification code should be regenerated.
 * @return string the verification code.
 */
public function getVerifyCode($regenerate = false)
{
    if ($this->fixedVerifyCode !== null) {
        return $this->fixedVerifyCode;
    }
    $session = Yii::$app->getSession();
    $session->open();
    $name = $this->getSessionKey();
    if ($session[$name] === null || $regenerate) {
        $session[$name] = $this->generateVerifyCode();
        $session[$name . 'count'] = 1;
    }
    return $session[$name];
}

可见 getVerifyCode() 方法是根据 $regenerate 值,确定是否获取新的验证码值,所以可以直接将 run() 中的调用都更改为 getVerifyCode(true)。更改后,调试发现验证码可以跟随页面刷新,但是为了方便维护,不建议直接修改源码。

解决问题

通过上述分析可知,修改 run() 方法中调用为 getVerifyCode(true) 可以解决问题,但是又不能修改源码,这时可以采取继承并重载的方法来实现了。

namespace admin\controllers\action;

use yii\web\Response;

class CaptchaAction extends \yii\captcha\CaptchaAction
{

    /**
     * 默认验证码刷新页面不会自动刷新
     */
    public function run()
    {
        $this->setHttpHeaders();
        \Yii::$app->response->format = Response::FORMAT_RAW;
        return $this->renderImage($this->getVerifyCode(true));
    }

}

在 SiteController 控制器中注册 CaptchaAction 方法:

public function actions()
{
    return [
        //默认验证码刷新页面不会自动刷新
        'captcha' => [
            'class' => 'admin\controllers\action\CaptchaAction',
            'testLimit' => 1,
            'maxLength' => 6,
            'minLength' => 6,
            'padding' => 1,
            'height' => 50,
            'width' => 140,
            'offset' => 1,
        ],
    ];
}

设置验证码验证规则:

class JoinForm extends \yii\base\Model
{
    /**
     * 验证码
     * @var
     */
    public $captcha;
    ... ...
    /**
     * 规则
     */
    public function rules()
    {
        return [
            [['captcha'], 'required'],
            //验证码校验
            ['captcha', 'captcha', 'captchaAction' => '/site/captcha'],
        ];
    }
}

验证

经过修改后,每次刷新页面验证码也会刷新,刷新验证码也只需要请求 1 次即可。


最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 175,273评论 25 709
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,363评论 19 139
  • API定义规范 本规范设计基于如下使用场景: 请求频率不是非常高:如果产品的使用周期内请求频率非常高,建议使用双通...
    有涯逐无涯阅读 7,722评论 0 6
  • 是我十七岁遇见的女孩 是我十八岁常写的名字 是我二十四不能的释怀 2017年7月28
    贾sir先生阅读 1,202评论 0 0
  • 2013年相识相知,我18岁那年开始到现在恋爱5年,我们恋爱多久就异地多久,记得他在太原我在大学城我们读大学的时候...
    泡泡今天不上班阅读 1,592评论 0 0