Как правильно перерисовать Recaptcha в ASP.NET MVC 2 после AJAX POST - PullRequest
3 голосов
/ 26 марта 2010

ОК ...

Я скачал и реализовал эту Реализацию Recaptcha для MVC, которая использует 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 и все вызовы Javascript в AjaxOptions работают нормально.

Проблема заключается в том, что если ModelState является недействительным в результате повторной проверки или какой-либо другой проверки, то 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);
   }

Когда InValid и форма отправляется обратно, по какой-то причине элемент управления ReCaptcha не выполняет повторную визуализацию. Я проверил источник и блоки <script> & <noscript> присутствуют в HTML, так что вспомогательная функция HTML ниже, очевидно, работает

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

Я предполагаю, что это как-то связано с тем, что сценарии, введенные в DOM AJAX, не выполняются повторно.

Как вы можете видеть из приведенного выше фрагмента HTML, я пытался добавить функцию javascript OnComplete= для повторного создания капчи на стороне клиента, но хотя скрипт выполняется без ошибок, он не ' т работа. Функция OnComplete is.

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

Может кто-нибудь пролить свет на это?

Спасибо, Эоин С

Ответы [ 3 ]

2 голосов
/ 27 марта 2010

Разобрался с решением этой проблемы.

Я полностью удалил клиентскую визуализацию капчи с помощью HTML Helper.

Вместо этого Фильтр остается на месте на стороне сервера для выполнения проверки ModelState и т. Д. *

И рендеринг на стороне клиента выполняется с помощью ReCaptcha AJAX Api от http://recaptcha.net/fastcgi/demo/ajax а также http://api.recaptcha.net/js/recaptcha_ajax.js

Каждый раз, когда происходит частичная публикация, капча исчезает, каждый раз, когда она завершается, сценарий OnComplete создает ее заново.

0 голосов
/ 29 сентября 2011

Я нашел эту реализацию AJAX очень полезной. http://www.darksideofthecarton.com/2008/12/15/validating-recaptcha-jquery-ajax/

Я применил в своем коде MVC то же решение, которое основано на этой статье:

http://devlicio.us/blogs/derik_whittaker/archive/2008/12/02/using-recaptcha-with-asp-net-mvc.aspx

0 голосов
/ 26 марта 2010

Я предполагаю, что расширение Html.CreateRecaptcha () создает <div> или что-то, что сценарии обновляют с изображением капчи. Разве функция Recaptcha.create () не должна передавать recaptcha (идентификатор элемента) вместо blahCaptcha (имя td)?

Взгляните на HTML, созданный Html.CreateRecaptcha, и попробуйте сослаться на id элемента, созданного этим расширением, вместо идентификатора содержащего td.

...