Question

问题：我有一个评论页面，每个评论框都有一个“回复”按钮。现在，回复按钮上有一个jquery实时点击绑定，当触发时通过ajax加载相应的注释表单。除了通常的字段外，每个表单还包含验证码输入。在表单成功提交（或其他方式）后，我刷新验证码，如下所示：

// submit triggered and form serialized
$.ajax({
 type: 'POST',
 url: myaction,
 data: serializedForm,
 cache: false,
 success: function(data, status) {
    //checks errors from server
    $servererr = $(data).find('.error_list');
    if($servererr.length === 0)
    {
      //flash success message...
      //refresh captcha
      $thisform.find('.captcha_img_refresh').trigger('click.refresh');
    }
    else {
       //flash the server errors and then refresh captcha         
      $thisform.find('.captcha_img_refresh').trigger('click.refresh');
    }
});

现在我在同一页面上打开了2个新的评论表单（f1和f2）（分别有2个不同的动作，分别为/ post / f1和post / f2）。我提交了f1并且没有报告错误。然后我转到第二个表单并输入所有有效的详细信息，它会从服务器抛出验证码错误（所以上面的else ajax语句执行）。萤火虫表明：

> //for first form
> POST http://mysite.com/post/f1 302 Found 111ms
> GET http://mysite.com/post/f1 200 OK 600ms
> 
> //for 2nd form
> POST http://mysite.com/post/f2 200 OK 800ms

为什么会这样？其他一切似乎都很好（在关闭javascript的情况下提交表单也没问题）。

表单HTML：

<form id="comment-form-<unique-number>" class="comment-form-new" action="/post/<separate-action>" method="post" style="">
 <p>Leave a comment:</p>
   <ul>
    <li>
     <textarea rows="10" cols="71" name="myform[text]" id="myform_text"></textarea></li>
    <li>
     <label for="myform_username">Name (required)</label>
     <input type="text" name="myform[username]" value="Anonymous" id="myform_username" /></li>
   <li>
      <label for="myform_email">Email (required)</label>
      <input type="text" name="myform[email]" value="" id="myform_email" />
   </li>

   <li>
    <label for="myform_captcha">Please enter code shown below:</label>
     <input type="text" name="myform[captcha]" id="myform_captcha" />
   </li>
   <li>
     <img id="captcha_img" src="/mysite/captcha/126263" alt="Captcha Image">
     <!-- this refreshes captcha -->
     <a class="captcha_img_refresh" id="captcha_img_refresh"><img src="/images/reload_original.png" /></a>
   </li>
   <input type="hidden" name="myform[comment_id]" value="10" id="myform_comment_id" />
   <li>
     <input type="submit" value="Submit" id="comment-form-submit" />
   </li>
</ul>

其他详细信息：每个评论表单加载后，我都会正常提交绑定（不是实时绑定）。每个表单的值都被序列化并在字段中键入，可以通过控制台日志确认。我正在使用Cryptographp库（http://www.captcha.fr/）进行验证码。

解决方案：如果我在提交任何一个表单后刷新页面上所有表单上的所有验证码，一些验证码会显示错误图像，当然，用户可以通过单击刷新来修复按钮再次。但我正在寻找除此解决方法之外的其他内容。

Answer 1

好的......我做了一些测试，这就是我认为正在发生的事情（我也可能是错的）：验证码图像链接，类似于： / mysite / captcha /（随机数），可能在服务器上为每个表单生成一次。当我加载f1然后加载f2时，f2的验证码链接存储在后端，它基本上使f1的验证码链接无效。因此，如果我提交f1（仍然打开），验证码将失败。所以我想我可以尝试（在前端）：

一次只允许一个回复表格
当用户关注相应的表单时，缓存验证码链接并再次使用它来重新生成图像
使用上述解决方法

有没有后端方法可以解决这个问题？

使用Captcha的多个表单 - Ajax提交时出错

1 个答案: