1

问题：我有一个评论页面，每个评论框都有一个“回复”按钮。现在回复按钮上有一个 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/ )。

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

4

1 回答 1

1

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

  1. 一次只允许一个回复表单
  2. 缓存验证码链接，当用户关注相应表单时再次使用它重新生成图像
  3. 使用上面提到的解决方法

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

于 2010-01-04T21:58:59.363 回答