Recaptcha biến mất trong khi PostBack

Question

Tôi đã thấy một vài bài đăng khác ở đây liên quan đến việc sử dụng Recaptcha với ASP.net UpdatePanels nhưng chưa tìm thấy câu trả lời giải quyết được vấn đề của tôi.

Đây là mã ASPX của tôi:

<asp:UpdatePanel ID="updRecaptcha" runat="server" UpdateMode="Always"> 
<ContentTemplate> 
    <recaptcha:RecaptchaControl ID="btnrecaptcha" runat="server" Theme="clean" PrivateKey"<%$ Resources: General, CaptchaPrivateKey %>" PublicKey="<%$ Resources: General, CaptchaPublicKey %>" />   
    <asp:Label ID="recaptchaerror" runat="server" style="color: Red;"/> 
</ContentTemplate> 
</asp:UpdatePanel> 

Vì vậy, cuộc sống kiểm soát ảnh xác thực lại trong một điều khiển người dùng có sử dụng một số điều khiển xác nhận Net (ví dụ RequiredFieldValidator). Tôi cần phải valdiate Recaptcha và các điều khiển ASP.net trước khi cho phép quá trình tiếp tục.

Nếu bất kỳ xác thực nào không thành công (Recaptcha hoặc .Net) thì điều khiển Recaptcha biến mất. Nhìn vào nguồn HTML, điều khiển không tải sau khi Postback - eventhough tôi đang nói UpdatePanel để cập nhật.

Tôi không thể tải lại hoàn toàn trang vì tất cả điều này xuất hiện dưới dạng lớp phủ ở đầu trang và có các trường biểu mẫu khác trên trang phía sau.

Vui lòng trợ giúp!

Edit:

Từ C# khi reCAPTCHA thất bại tôi kêu gọi mã này:

ScriptManager.RegisterClientScriptBlock(Page, Page.GetType(), "InvalidRecaptcha", "alert('Recaptcha Failed');Recaptcha.reload();alert('Recaptcha Reloaded');", true); 

Cả hai báo cáo lửa cảnh báo nhưng reCAPTCHA vẫn không tải.

Answer 1

Quên ScriptManager. Tất cả những gì bạn cần là kịch bản này trong trang. Thay đổi cho phù cho định danh của bạn:

<script type="text/javascript"> 
// RECAPTURE CODE FOR RELOADING AFTER INCORRECT ENTRY 
if (typeof Sys != 'undefined') { 
    var requestManager = Sys.WebForms.PageRequestManager.getInstance(); 
    requestManager.add_endRequest(function(sender, args) { 

     $('<div id="recaptcha_widget_div"/>').appendTo('#recaptcha_widget_div2'); 

     if (typeof Recaptcha != 'undefined') {         
      Recaptcha.create(recaptcha_key, "recaptcha_widget_div", 
      { 
       theme: "red", 
       callback: Recaptcha.focus_response_field 
      }); 
     } 
    }); 
} 

Answer 2

Bạn cần phải tải lại quyền kiểm soát với javascript reCaptcha, hãy thử này:

protected void Button1_Click(object sender, EventArgs e) 
{ 
    btnrecaptcha.Validate(); 
    if(IsValid && updRecaptcha.IsValid} 
    { 
      //Some logic here 
    } 
    ScriptManager.RegisterClientScriptBlock(Page, Page.GetType(), "CaptchaReload", "Recaptcha.reload();", true); 
} 

Answer 3

Các giải pháp chấp nhận không làm việc cho tôi. Dưới đây là câu trả lời mà tôi đã cố gắng và đang làm việc:

ASP.Net, disappearing Recaptcha, UpdatePanels and Partial PostBacks: Fixed once and for all

Về cơ bản nó liên quan đến việc tạo ra một div ẩn và sử dụng jquery để tái render html. Ngoài ra, bài đăng trên blog cung cấp một phân tích nhỏ về các giải pháp điển hình (ví dụ: sử dụng RegisterClientScriptBlock với tải lại đơn giản) và tại sao chúng không thành công.

<div runat="server" id="pbTarget" visible="false"></div> 
<recaptcha:RecaptchaControl ID="recaptcha" runat="server" Theme="clean" /> 

mã sau:

protected void btnSubmit_Click(object sender, EventArgs e) 
{ 
    recaptcha.Validate(); 
    if (!Page.IsValid || !recaptcha.IsValid) 
    { 
    pbTarget.Visible = true; 
    ScriptManager.RegisterClientScriptBlock( 
     recaptcha, 
     recaptcha.GetType(), 
     "recaptcha", 
     "Recaptcha._init_options(RecaptchaOptions);" 
     + "if (RecaptchaOptions && \"custom\" == RecaptchaOptions.theme)" 
     + "{" 
     + " if (RecaptchaOptions.custom_theme_widget)" 
     + " {" 
     + " Recaptcha.widget = Recaptcha.$(RecaptchaOptions.custom_theme_widget);" 
     + " Recaptcha.challenge_callback();" 
     + " }" 
     + "} else {" 
     + " if (Recaptcha.widget == null || !document.getElementById(\"recaptcha_widget_div\"))" 
     + " {" 
     + " jQuery(\"#" + pbTarget.ClientID + "\").html('<div id=\"recaptcha_widget_div\" style=\"display:none\"></div>');" 
     + " Recaptcha.widget = Recaptcha.$(\"recaptcha_widget_div\");" 
     + " }" 
     + " Recaptcha.reload();" 
     + " Recaptcha.challenge_callback();" 
     + "}", 
     true 
    ); 

    return; 
    } 
    else 
    { 
    //normal page processing here... 

Answer 4

Đáng ngạc nhiên, tôi không cần phải áp dụng các cuộc gọi RegisterClientScriptBlock để làm cho nó làm việc. tôi chỉ sử dụng:

UpdateMode = "Luôn luôn"

cho updatepanel và ở phía máy chủ tôi gọi:

updatePanel.Update(); 

này cũng ngăn chặn các hình ảnh xác thực hiển thị một thử thách mới .

Answer 5

Câu trả lời của tôi về cơ bản giống với "Người dùng" (rằngđã hoạt động!), Nhưng để giúp bất kỳ ai sử dụng VB. Tôi đã nhận xét ở đó, nhưng tôi có đại diện zippo ... (hy vọng đây không phải là quá nhiều của một vi phạm, và nó giúp một ai đó ra)

Tôi đã chuyển thịt này sang VB.NET:

pbTarget.Visible = True 
     Dim _sb As New StringBuilder 
     With _sb 
      .Append("Recaptcha._init_options(RecaptchaOptions);") 
      .Append("if (RecaptchaOptions && ""custom"" == RecaptchaOptions.theme)") 
      .Append("{") 
      .Append(" if (RecaptchaOptions.custom_theme_widget)") 
      .Append(" {") 
      .Append(" Recaptcha.widget = Recaptcha.$(RecaptchaOptions.custom_theme_widget);") 
      .Append(" Recaptcha.challenge_callback();") 
      .Append(" }") 
      .Append("} else {") 
      .Append(" if (Recaptcha.widget == null || !document.getElementById(""recaptcha_widget_div""))") 
      .Append(" {") 
      .Append(" jQuery(""#") 
      .Append(pbTarget.ClientID) 
      .Append(""").html('<div id=""recaptcha_widget_div"" style=""display:none""></div>');") 
      .Append(" Recaptcha.widget = Recaptcha.$(""recaptcha_widget_div"");") 
      .Append(" }") 
      .Append(" Recaptcha.reload();") 
      .Append(" Recaptcha.challenge_callback();") 
      .Append("}") 
     End With 
     ScriptManager.RegisterClientScriptBlock(recaptcha, recaptcha.[GetType](), "recaptcha", _sb.ToString, True) 

Answer 6

Nếu bạn đang sử dụng xác thực lại 2.0 này là Javascript của bạn

<script type="text/javascript"> 
    function CaptchaReload() { 
      Recaptcha.create("yourpublicKey", 'yourRecaptchadiv', { 
      theme: 'white', 
      callback: grecaptcha.reset() 

     }); 
     } 

Đây là reCAPTCHA của bạn Div

<div class="g-recaptcha" data-sitekey="yourPublicKey"></div> 

Sau đó, vào cuối sự kiện postback gọi Javascript

protected void txtEmail_TextChanged(object sender, EventArgs e) 
{ 
    if (txtEmail.Text != string.Empty) 
    { 
     ValidateEmail(); 
     ScriptManager.RegisterStartupScript(this, this.GetType(), "CaptchaReload", "$.getScript(\"https://www.google.com/recaptcha/api.js\", function() {});", true); 
    } 
} 

Answer 7

tôi đã có thể làm cho nó hoạt sử dụng phiên bản 2.1.0.0 của thư viện reCAPTCHA cho NET với webforms, quản lý kịch bản và bên trong một bảng cập nhật.

Đầu tiên, trong trang .aspx bên ngoài của bảng điều khiển cập nhật Tôi đang tải các thư viện Google reCAPTCHA:

<script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit" 
      async defer></script> 

Thứ hai, trong trang .aspx bên trong bảng cập nhật Tôi đã thêm một div mà sẽ làm việc như bảng điều khiển mục tiêu để nạp reCAPTCHA:

<div runat="server" id="pbTarget" visible="false"></div> 
<cc1:Recaptcha ID="recaptcha" runat="server" Theme="Clean" /> 

thứ ba, trong các mã sau vào cuối sự kiện postback của tôi, tôi đã đăng ký một kịch bản khởi động để làm cho reCAPTCHA trong bảng mục tiêu của tôi

Private Sub cmdSubmit_Click(sender As Object, e As EventArgs) Handles cmdSubmit.Click 
    pbTarget.Visible = True 
    ScriptManager.RegisterStartupScript(
     UpdatePanel1, 
     UpdatePanel1.GetType(), 
     "loadCaptcha", 
     "grecaptcha.render('" & pbTarget.ClientID & "', {'sitekey': 'YourKey' });", 
End Sub