如何刷新页面刷新/加载上的验证码图像？

编程问答 2022-04-26

问题描述

| 我想强迫我的网站在每次加载时都刷新验证码图像，所以我有一个用onload（）事件触发的javascript方法。在这里，我有以下几行： 
document.getElementById(\'yw0_button\').click;
Firebug不会检测到任何错误，出于测试目的，我在显示的行后立即添加了一个警报，每次加载页面时都会弹出警报。但是，图像不会刷新！ 我认为这与视图文件有关： 
<?PHP if(extension_loaded(\'gd\')): ?>
    <div class=\"row\">
        <?PHP echo $form->labelEx($model,\'verifyCode\'); ?>
        <div>
            <?PHP
            $this->widget(\'CCaptcha\',array(\'showRefreshButton\'=>true,\'buttonType\'=>\'button\',\'buttonoptions\'=>
                                                    array(\'type\'=>\'image\',\'src\'=>\"/path/images/refresh-icon.png\",\'width\'=>30,),\'buttonLabel\'=>\'Refrescar imagen\'),false); 
            ?>
            <br>
            <?PHP echo $form->textField($model,\'verifyCode\'); ?>
        </div>
    <div class=\"hint\">
        Porfavor ingrese las letras como las ve en la imagen superior.
        <br/>No hay distincion entre minúsculas y mayúsculas.</div>
    </div>
<?PHP endif; ?>
有任何想法吗？ @k到z刚看到了这个！是的，如果您能帮助我找到更合适的解决方案，那就太好了！这是我认为与视图文件有关的内容： 
<?PHP if(extension_loaded(\'gd\')): ?>
        <div class=\"row\">
            <?PHP echo $form->labelEx($model,\'verifyCode\'); ?>
            <div>
                <?PHP
                $this->widget(\'CCaptcha\',\'buttonoptions\'=>
                                                        array(\'type\'=>\'image\',false); 
                ?>
                <br>
                <?PHP echo $form->textField($model,\'verifyCode\'); ?>
            </div>
        <div class=\"hint\">
            Porfavor ingrese las letras como las ve en la imagen superior.
            <br/>No hay distincion entre minúsculas y mayúsculas.</div>
        </div>
    <?PHP endif; ?>
在控制器中，我将在accessRules（）方法中向授权用户授予验证码操作的权限，仅此而已。还有什么我可以张贴的吗？     

解决方法

        如果有人在开始使用Yii时遇到类似的问题。.这就是我解决了触发点击的CAPTCHA问题：我有一个事件触发了onload事件，该事件具有以下代码： $（\'＃yw0_button \'）。click（）; 当然一定有更好的方法，即时开放的建议！但是，作为一种临时解决方案，它可以很好地工作，每次加载页面时刷新验证码图像。祝好运！ 编辑：我所做的是像这样处理我的html页面的onload事件 
<body onload=\"initialize()\"> 
.. 
</body>
然后在我的js文件中： 
function initialize() 
{ 
     $(\'#yw0_button\').click(); 
}
    ,        我希望我可以提出一种更好的方法来解决Soph提到的问题。我知道这不是这个问题上瘾的与JavaScript相关的解决方案，但是正如我所看到的，这是最正确的方法。 我面临着相同的要求-在页面刷新时刷新标题，但是当用户的输入在其他字段上无效时保留该标题，因为在每次验证失败时都重复一个新的验证码很烦人。因此，此任务看起来好像不刷新
POST
请求的标题，否则刷新它（
GET
请求）。 Soph自己提出的解决方案无法实现这一目标-因为可能知道“ 5”个请求已发送到服务器，并且客户端JavaScript无法分析其数据。 因此，我决定看一下Yii的验证码实现。它由位于“ 8”包中的两个类组成。前者是从ѭ10扩展为
CCaptcha
，我们在视图中使用这种方式将验证码添加到网络表单中，如下所示： 
<?php 
    $this->widget(\"CCaptcha\",array(
    \'buttonLabel\' => \"Generate another code\",\'showRefreshButton\' => false,\'clickableImage\' => true
));
?>
后者是
CCaptchaAction
，它通过生成验证码和创建图像来提供验证码的工作最为重要。考虑到Yii被设计为面向对象，我们可以创建几个我们自己的类
Captcha
和
CaptchaAction
，它们分别相对于
CCaptcha
和
CCaptchaAction
扩展，并将它们放置在Web应用程序目录的
components
子目录中。 这两个类的实现如下。 覆盖了
CCaptchaAction
的
run()
方法，该方法与原始方法非常相似，不同之处在于，当设置了
render_refreshed
GET参数并且正在动态生成新的验证码并渲染并返回相应的新图像时，将执行一个附加的
if
分支。作为行动的结果。 
Captcha
类中引入了公共
refresh
变量，默认变量为
false
，这意味着小部件的行为类似于
CCaptcha
的行为。重写“ 26”方法时，我们更改了负责准备小部件的输出HTML代码的代码。为了更加精确，在此处准备了指向验证码操作的链接，将其用作an28ѭ标签的
src
属性。如果将“ 22”成员设置为“ 30”，则会在此链接后附加一个“ 21”参数。 这是
CaptchaAction.php
： 
<?php

Yii::import(\"system.web.widgets.captcha.CCaptchaAction\");

class CaptchaAction extends CCaptchaAction
{
    const RENDER_REFRESHED_GET_VAR = \"render_refreshed\";

    public function run()
    {
        if (isset($_GET[self::REFRESH_GET_VAR]))  // AJAX request for regenerating code
        {
            $code = $this->getVerifyCode(true);
            echo CJSON::encode(array(
                \'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\'=> $this->getController()->createUrl($this->getId(),array(
                    \'v\' => uniqid()
                )),));
        }
        else if (isset($_GET[self::RENDER_REFRESHED_GET_VAR]))
        {
            $this->renderImage($this->getVerifyCode(true));
        }
        else
            $this->renderImage($this->getVerifyCode());
        Yii::app()->end();
    }
}
这是
Captcha.php
： 
<?php

Yii::import(\"web.system.widgets.CCaptcha\");

class Captcha extends CCaptcha
{
    public $refresh = false;

    protected function renderImage()
    {
        if (!isset($this->imageOptions[\'id\']))
            $this->imageOptions[\'id\'] = $this->getId();

        if ($this->refresh)
        {
            $url = $this->getController()->createUrl($this->captchaAction,array(
                \'v\' => uniqid(),CaptchaAction::RENDER_REFRESHED_GET_VAR => 1
            ));
        }
        else
        {
            $url = $this->getController()->createUrl($this->captchaAction,array(
                \'v\' => uniqid()
            ));
        }
        $alt = isset($this->imageOptions[\'alt\']) ? $this->imageOptions[\'alt\'] : \'\';
        echo CHtml::image($url,$alt,$this->imageOptions);
    }
}
因此用法非常简单。在为网站页面准备模型数据时，请执行以下操作： 
...

// Creating order model\'s instance
$model = new MyModel();
$refreshCaptcha = true;

if (isset($_POST[\'MyModel\']))
{
    $refreshCaptcha = false;
    ...
}

...

$this->render(\"myView\",array(
    \'model\' => $model,\'refreshCaptcha\' => $refreshCaptcha
));
之后，在此页面操作的
myView
模板中修改验证码的小部件调用： 
<?php 
    $this->widget(\"Captcha\",\'clickableImage\' => true,\'refresh\' => $refreshCaptcha
));
并且不要忘记通过将
CCaptchaAction
类替换为
CaptchaAction
来修改页面控制器的
actions
方法： 
public function actions()
{
    return array(
        \'captcha\'=>array(
            \'class\'=>\'CaptchaAction\',\'backColor\'=>0xFFFFFF
        )
    );
}
在我看来，它按预期工作。希望这会帮助到别人。     ,        我想在Ezze的答案中添加一些内容： 为了使clientValidation正常工作，您可以使用自定义的验证码验证： 
class CaptchaValidatorRefresh extends CCaptchaValidator
{
    public function clientValidateAttribute($object,$attribute)
{
    $js=\"\";

    if(!$this->allowEmpty)
    {
        $message=$this->message!==null ? $this->message : Yii::t(\'yii\',\'The verification code is incorrect.\');

        $js=\"
            if($.trim(value)==\'\') {
                messages.push(\".CJSON::encode($message).\");
            }
        \";
    }       
    return $js;
    }
}
接着 
public function rules()
{
    return array(
        array(\'verifyCode\',\'CaptchaValidatorRefresh\',\'on\'=>\'request\',\'allowEmpty\'=>!CCaptcha::checkRequirements()),);
}
    ,        添加此javascript： 
jQuery(document).ready(function() {
    jQuery.ajax({
        \'success\':function(html){jQuery(\"#yw0\").attr(\"src\",html)},\'url\':\'/checkout/finish/captcha?refresh=1\',\'cache\':false
    });
    return false;
});
    ,        您可以在表格beginWedget之前编写脚本。 每次加载页面时，都会生成新的验证码。 
  $script=\' $(document).ready(function() {

            document.getElementById(\"yw0_button\").click();
    });\';
  Yii::app()->clientScript->registerScript(\'yw0_button\',$script);

  $form=$this->beginWidget(\'CActiveForm\',array(
    \'id\'=>\'test-form\',\'action\'=>Yii::app()->createUrl(\'controllerName/actionName\'),\'enableClientValidation\'=>true,\'clientOptions\'=>array(
        \'validateOnSubmit\'=>true,),));
它为我工作。 希望它也对您有用     ,        这是另一种（正确的）方法（讨论）： 
Yii::app()->getController()->createAction(\'captcha\')->getVerifyCode(true);
    ,我曾经使用过：http://www.yiiframework.com/extension/captcha-extended/ 并更改CaptchaExtendedAction.php（路径：扩展名/ captchaExtended） 在第154行 
$this->renderImage($this->getVerifyCode());
至 
$this->renderImage($this->getVerifyCode(true));
    ,        我为你们提供了更好的解决方案： 
public function beforeAction($action)
{
    if($action->id == \'captcha\'){
        $action->getVerifyCode(true);
    }
    return parent::beforeAction($action); 
}
将这些代码放入包含验证码操作的控制器中！     
刷新刷新加载加载加载图像页面页面验证验证验证