Using Recaptcha with EPiServer XForms

问题

Does any one have experiense of using Recaptcha with XForms in EPiServer?

I don't know where to put the Recaptcha control and how to make it work. The sample code for ASP.NET is the code below. Where should i put it. My guess is in the FormControl_BeforeSubmitPostedData?

 <%@ Page Language="VB" %>
 <%@ Register TagPrefix="recaptcha" Namespace="Recaptcha" Assembly="Recaptcha" %>  
 <script runat=server%gt;       
 Sub btnSubmit_Click(ByVal sender As Object, ByVal e As EventArgs)           
    If Page.IsValid Then               
        lblResult.Text = "You Got It!"               
        lblResult.ForeColor = Drawing.Color.Green           
    Else               
        lblResult.Text = "Incorrect"               
        lblResult.ForeColor = Drawing.Color.Red           
    End If       
 End Sub   
 </script>   
 <html>   
 <body>       
 <form runat="server">           
     <asp:Label Visible=false ID="lblResult" runat="server" />
     <recaptcha:RecaptchaControl ID="recaptcha" runat="server" Theme="red"
                                 PublicKey="your_public_key" PrivateKey="your_private_key" />
     <asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClick="btnSubmit_Click" />
 </form>   
 </body>   
 </html>

回答1:

I've had some experience with modifying the output of XForms within EPiServer, but I have not added any captcha controls before. I hope I can help you get there!

I do all modification of the XForms output on the XFormControl.BeforeLoadingForm event. You can assign an event handler to this either within the Global.asax.cs or create a static initializer class that instantiates the first time somebody navigates onto a form page (my template class inherits from this initialiser class.) I only did this because I needed a nice deployable solution without changing Global.asax. Anyway, I digress.

For now, I'd suggest doing it within the Global.asax.cs just to get you working. There is example code within the Global.asax.cs that is installed with the PublicTemplates pack. Look for the 'Global XFrom Events' region.

The 'markup' of the XForm is exposed though the BeforeLoadingForm event arguments.

e.FormDefinition

Modifying this string will change the rendered output of the form, regardless of what the user created within the XForm editor. For example:

e.FormDefinition += "<asp:HyperLink runat=\"server\" Text=\"HyperLink\" />";

This example obviously adds markup to what currently exists, but you can completely transform the original markup if you wish. (I use regex to transform the tables into div/fieldset tags)

I hope this helps you get to your solution.

Example code for Global.asax.cs

protected void Application_Start(Object sender, EventArgs e)
{
    XFormControl.ControlSetup += new EventHandler(XForm_ControlSetup);
}

public void XForm_ControlSetup(object sender, EventArgs e)
{
    XFormControl control = (XFormControl)sender;

    control.BeforeLoadingForm += new LoadFormEventHandler(XForm_BeforeLoadingForm);
}

public void XForm_BeforeLoadingForm(object sender, LoadFormEventArgs e)
{
    XFormControl formControl = (XFormControl)sender;

    //We set the validation group of the form to match our global validation group in the master page.
    formControl.ValidationGroup = "XForm";

    e.FormDefinition += "<asp:HyperLink runat=\"server\" NavigationUrl=\"#\" Text=\"HyperLink\" />";
}

EDIT:

Sorry, the above code will help you integrate the captcha control into your form but completely missed out the part of actually checking whether the captcha control input is valid before submitting the form!

I agree that you would perform a check on the control within XFormControl.BeforeSubmitPostedData. Then if the captcha is not valid output an error message and set e.CancelSubmit to true.

RESPONSE TO COMMENTS:

I may be simplifying things too much but this is a quick example of what I think you need. In your XForm user control code you need something similar to this:

protected override void OnInit(EventArgs e)
{
    base.OnInit(e);

    this.FormControl.BeforeLoadingForm += new LoadFormEventHandler(FormControl_BeforeLoadingForm);
    this.FormControl.BeforeSubmitPostedData += new SaveFormDataEventHandler(FormControl_BeforeSubmitPostedData);
}

void FormControl_BeforeLoadingForm(object sender, LoadFormEventArgs e)
{
    e.FormDefinition += "<recaptcha:RecaptchaControl runat=\"server\" id=\"CaptchaControl\" />";
}

void FormControl_BeforeSubmitPostedData(object sender, SaveFormDataEventArgs e)
{
    /* find the captcha control e.g. FormControl.FindControl("CaptchaControl") or otherwise
     * test if the control is valid
     * if not valid e.CancelSubmit = true (show error etc.)
     */
}

As for the above example, as long as you have the Recaptcha control registered in your web.config or at the top of your template/usercontrol markup then it should work. You should find that the captcha control is just added onto the end of the form (probably not where you really want it to be, but this can be changed in your own way as long as you can pinpoint where you want to insert it within the e.FormDefinition string.

Where "FormControl" is the XForm control within your user control markup.

EDIT (23/12/2010):

The captcha control must be registered within the web.config NOT at the top of the markup file.

<add tagPrefix="recaptcha" namespace="Recaptcha" assembly="Recaptcha" />

回答2:

If the goal is to prevent spam a more accessible way is to check the form input using Akismet. We have done this for XForms in EPiServer for multiple customers and it works great.

An article on why CAPTCHA isn't good for accessibility: http://www.456bereastreet.com/archive/200709/provide_an_accessible_alternative_if_you_must_use_a_captcha/

来源：https://stackoverflow.com/questions/4507544/using-recaptcha-with-episerver-xforms

标签

recaptcha

xforms

episerver