如何在 AJAX POST 后正确地在 ASP.NET MVC 2 中重新呈现 Recaptcha答案

【问题标题】：How do I correctly Re-render a Recaptcha in ASP.NET MVC 2 after an AJAX POST如何在 AJAX POST 后正确地在 ASP.NET MVC 2 中重新呈现 Recaptcha
【发布时间】：2011-02-01 06:18:48
【问题描述】：

好的……

我已经为 MVC 下载并实现了这个 Recaptcha implementation，它使用 ModelState 来确认验证码控件的有效性。

它工作得非常好......除非我开始在 AJAX 表单中使用它。

简而言之，当一个 div 使用 AJAX 重新渲染时，它应该包含的 ReCaptcha 不会出现，即使相关的<scripts> 在部分渲染后的源中也是如此。

代码如下。

 using (Ajax.BeginForm("CreateComment", "Blog", 
        new AjaxOptions() { HttpMethod = "POST", 
         UpdateTargetId = "CommentAdd", OnComplete="ReloadRecaptcha", 
         OnSuccess = "ShowComment", OnFailure = "ShowComment", 
         OnBegin = "HideComment" }))
{%>
    <fieldset class="comment">
        <legend>Add New Comment</legend>
        <%= Html.ValidationSummary()%>
        <table class="postdetails">
            <tbody>
                <tr>
                    <td rowspan="3" id="blahCaptcha">
                        <%= Html.CreateRecaptcha("recaptcha", "blackglass") %>
                    </td>
                    .... Remainder of Form Omitted for Brevity

我已经确认，当 Recaptcha 控件不存在并且 AjaxOptions 中的 Javascript 调用都可以正常工作时，表单可以正常工作。

问题在于，如果 ModelState 由于 Recaptcha 或其他验证而无效，则 ActionResult 返回视图以重新显示表单。

    [RecaptchaFilter(IgnoreOnMobile = true)]
    [HttpPost]
    public ActionResult CreateComment(Comment c)
    {
        if (ModelState.IsValid)
        {
            try
            {
                //Code to insert Comment To DB
                return Content("Thank You");
            }
            catch
            {
                ModelState.AddRuleViolations(c.GetRuleViolations());
            }
        }
        else
        {
            ModelState.AddRuleViolations(c.GetRuleViolations());
        }
        return View("CreateComment", c);
   }

当它无效并且表单回发时，由于某种原因，ReCaptcha 控件不会重新呈现。我检查了源代码，<script> 和 <noscript> 块存在于 HTML 中，因此下面的 HTML Helper 函数显然可以工作

<%= Html.CreateRecaptcha("recaptcha", "blackglass") %>

我认为这与通过 AJAX 注入 DOM 的脚本没有重新执行有关。

从上面的HTMLsn-p 可以看到，我尝试添加一个OnComplete= javascript 函数来在客户端重新创建验证码，但是虽然脚本执行没有错误，但它不起作用。 OnComplete 函数是。

    function ReloadRecaptcha() {
        Recaptcha.create("my-pub-key", 'blahCaptcha', { 
            //blahCaptcha is the ID of the <td> where the ReCaptcha should go.
            theme: 'blackglass'
            });
    }

任何人都可以对此有所了解吗？

谢谢， Eoin C

【问题讨论】：

标签： asp.net-mvc ajax jquery captcha recaptcha

【解决方案1】：

想出了解决办法。

我使用 HTML Helper 完全删除了验证码的客户端呈现。

相反，过滤器保留在服务器端以进行 ModelState 验证等...

客户端渲染全部使用来自的 ReCaptcha AJAX Api 完成 http://recaptcha.net/fastcgi/demo/ajax 和 http://api.recaptcha.net/js/recaptcha_ajax.js

每次出现部分帖子时，验证码都会消失，每次完成时，OnComplete 脚本都会重新创建它。

【讨论】：

【解决方案2】：