如何在单击刷新按钮时重新加载 Zend Captcha 图像？

Question

我在我的 php 页面中应用了 zend 验证码，现在我需要添加验证码重新加载按钮。请根据zend给出答案。

Answer 1

1. 在config/autoload/global.php中添加以下内容

   'view_manager' =>;大批（
       '策略' =>大批（
           'ViewJsonStrategy','Zend\View\Strategy\PhpRendererStrategy'
       ),
   ),
   

2. 在YourModule/src/YourModule中创建一个新文件夹Ajax

3. 在Yourmodule/Ajax内创建一个文件AjaxController.php

   命名空间 YourModule\Ajax;
   
   使用 Zend\Mvc\Controller\AbstractActionController；
   使用 Zend\View\Model\JsonModel；
   使用 YourModule\Forms\SignupForm；
   
   AjaxController 类扩展 AbstractActionController
   {          
       公共函数refreshSignupCaptchaAction（）{
           $form = new SignupForm();
           $captcha = $form->get('captcha')->getCaptcha();             
           $数据=数组();                
           $data['id'] = $captcha->generate();
           $data['src'] = $captcha->getImgUrl().$captcha->getId().$captcha->getSuffix();
           返回新的 JsonModel($data);
       }
   }
   

4. 在 module.config.php 中添加路由

   'yourmodule-ajax' => 数组(
           '类型' => '部分'，
           '选项' =>大批（
           '路线' => '/yourmodule/ajax/:action',
               '约束' =>大批（    
                   '行动' => '\w+',
               ),
               '默认' =>大批（
                   '控制器' => '你的模块\Ajax\AjaxController',
               ）                  
           ),
       ),
   

5. 最后在模板中，我假设您使用的是 jquery

   
       
   
           formLabel($form->get('验证码')); ？>
           
   
               刷新
               formElement($form->get('验证码')); ？>
               formElementErrors($form->get('captcha')); ？>
           
       
   
   
   <脚本类型=“text/javascript”>
   $(函数(){
   
       $('#refreshcaptcha').click(function() { 
           $.ajax({ 
               url: 'url('yourmodule-ajax', array('action'=>'refreshSignupCaptcha')) ?>', 
               数据类型：'json', 
               成功：函数（数据）{ 
                   $('#captcha img').attr('src', data.src); 
                   $('#captcha input[type="hidden"]').attr('value', data.id); 
                   $('#captcha input[type="text"]').focus(); 
               }
           }); 
           返回假；
       });
   });
   
   

Answer 2

只是两个简短的片段，但我想您会明白的。根据您的需要调整元素名称和选择器。

在您的控制器中添加一个方法来生成新的验证码

public function refreshAction()
{
    $form = new Form_Contact();
    $captcha = $form->getElement('captcha')->getCaptcha();

    $data = array();

    $data['id']  = $captcha->generate();
    $data['src'] = $captcha->getImgUrl() .
                   $captcha->getId() .
                   $captcha->getSuffix();

   $this->_helper->json($data);
}

在您的视图脚本中（我使用 mootools 进行 ajax 请求）

document.addEvent('domready', function() {
     $('#contactForm img').addEvent('click', function() {
        var jsonRequest = new Request.JSON({
            url: "<?= $this->url(array('controller' => 'contact', 'action' => 'refresh'), 'default', false) ?>",
            onSuccess: function(captcha) {
                $('captcha-id').set('value', captcha.id);
                $('#contactForm img').set('src', captcha.src);
            }
        }).get();
    });
});

编辑：添加了 pahan 的 jquery

$(document).ready(function() {
    $('#refreshcaptcha').click(function() { 
        $.ajax({ 
            url: '/contact/refresh', 
            dataType:'json', 
            success: function(data) { 
                $('#contactForm img').attr('src', data.src); 
                $('#captcha-id').attr('value', data.id); 
            }
        }); 
    }); 
});

Answer 3

@user236501 实际上它可以是任何类型的 Zend Form Element（例如 Button）。您甚至可以将可点击的刷新链接作为 Zend_Form_Element_Captcha 描述选项，如下所示：

        $captcha = new Zend_Form_Element_Captcha('captcha', array(
            'label' => 'Some text...',
            'captcha' => array(
                'captcha' => 'Image',
                'wordLen' => 6,
                'timeout' => 300,
                'font' => './fonts/Arial.ttf',
                'imgDir' => './captcha/',
                'imgUrl' => 'http://some_host/captcha/'
            ),
            'description' => '<div id="refreshcaptcha">Refresh Captcha Image</div>'
        ));

但在这种情况下，应该修改 Description 装饰器的选项，例如：

        $this->getElement('captcha')->getDecorator('Description')->setOptions(array(
            'escape'        => false,
            'style'         => 'cursor: pointer; color: #ED1C24',
            'tag'           => 'div'
        ));

它可以在表单的 init() 中完成方法。
对不起我的英语。顺便说一句，我不确定我的评论是否放在正确的位置；）

Answer 4

@本杰明·克莱默
感谢您的代码，就像魅力一样:)
读完这篇文章后
我是用jquery做的。

$(document).ready(function() {
    $('#refreshcaptcha').click(function() {
        $.ajax({
            url: '/contact/refresh',
            dataType:'json',
            success: function(data) {
                $('#contactForm img').attr('src',data.src);
                $('#captcha-id').attr('value',data.id);
            }
        });
    });
});