XForm spam prevention with reCAPTCHA or jQuery slider
Surprisingly few of my customers has reported problems with spam in their XForms but some have. This blog post is an exercise in how this issue can be addressed. There are a lot of methods for protecting spam in forms, logins, forums etc. Some of the most widely used are captchas or some logical puzzle, basically any method that automated spam bots has a hard time solving but humans solves easily is used.
I’ve decided to do two different methods. The first is integration of reCAPTCHA in XForm. Here’s an example how it can look like with reCAPTCHAS “clean” theme.
This is the XForm from the Public templates. To do this I’ve hooked in to the ControlsCreated event of the XFormControl on the page. There I create a new control of type RecaptchaControl and add this to the XFormControl above the submit button. Download the reCAPTCHA ASP.NET library (it’s just a dll). Drop it in your bin folder and add a reference to the dll. Heres the ControlsCreated event handler.
3: Recaptcha.RecaptchaControl objControl = FormControl.FindControl("MyReCaptcha") as Recaptcha.RecaptchaControl;
5:if (objControl != null)
11:// TODO: Notify user that validation failed
12: e.CancelSubmit = true;
That’s it. Add a custom validator or some other kind of user feedback if validation fails…
With that said I must admit… I hate captchas. I think it’s an intrusive way that hinders user interaction. I’ve also seen a lot of bad captchas that’s barely readable which I find annoying. Your users deserves better.
My humble approach to spam prevention without pissing off my users are to use a jQuery slider instead of a button. Here’s how it can look.
The idea here is that spam bots can’t interact with the slider. Help me out here readers… is this true? This demands just slightly more effort from the users compared to clicking a button.
I add the slider like I did the reCAPTCHA with the difference that I also hide the submit button. If you want to use the options that the editor can set for the forms submit button (ChannelOptions, mail addresses and subject) when the slider does postback, this is the place to do it. See the code below.
I’ve implemented the slider the same way that the reCAPTCHA is implemented – as a class inheriting from System.Web.UI.WebControls.WebControl. There I override the Render() and RenderContents() methods (link to source at the end of this blog post). Note that in order to get the slider to postback you’ll have to provide a postback string. This can be obtained from Page.ClientScript.GetPostBackEventReference(). To check if the slider is postbacking I do this in Page_Load()
I’d really like your opinion on using a jQuery slider as spam prevention. Does it stop spam bots? Is there any other way for a bot to interact with a slider besides simulating mouse movements and clicks? I’ve been running the slider variant on my public site “protecting” blog comments and a guestbook for a few months now. So far no spam… Feel free to post your thoughts on the effectiveness of having a slider as opposed to having a captcha.