Thursday, 10 November 2011

How to add ReCaptcha in SharePoint 2010

- and what are the challenges

I have resently added ReCaptcha in a SharePoint 2010 Solution.
The goal was to add extra security to an existing form in a web part.
I have the following assumptions:
- I have an existing Visual Studio Solution.
- I have a Project in the solution.
- I have added a Visual web part in the project.

Get Recaptcha
First of all I requested a key on the Recaptcha homepage and I downloaded the assembly (Recaptcha.dll) that I needed.
Sign up: ""
Download: ""

Add Recaptcha to my solution
The next thing was to get the assembly in to my Visual Studio solution.
In a project in my solution I created a folder called Dependencies and in this folder I added the Recaptcha.dll.

In my solution I wanted to add the dll to the Gac, and I did it like this:
- I double clicked on the Package folder in the project where I added the dll.

In the Package dialog I clicked on the link Advanced.

In the Advanced dialog I clicked Add -> Add Existing Assembly...
- Source Path: I located the file in the project folder. ("Dependencies\Recaptcha.dll")
- Deployment Target: GlobalAssemblyCache.
- Location: Recapture

I clicked "Click here to add a new item."
In the new item I added:
- Namespace: Recaptcha
- Assembyname: Recaptcha, Version=, Culture=neutral, PublicKeyToken=9afc4d65b28c38c2
- Safe: Checked
I Clicked OK.
Now the dll was added to the GAC the next time I deployed the wsp file.

Add ReCaptcha to the form
The next thing was to add the control to my form.
Before adding the ReCaptcha control to the form, I had to register the assembly, so I added the following code:

Then I added the control where I wanted it to be placed:

<recaptcha:RecaptchaControl ID="ReCaptcha" runat="server" PublicKey="***" PrivateKey="***" Theme="clean" />

PublicKey and PrivateKey was the ones I got from the ReCaptcha email tahat I got when I signed up for a key.

Now the challanges began
My challanges was:
1. No way to set the ErrorMessage on the Captcha object
2. An error in the Captcha will appear in the ValidationSummary, in english (ErrorMessage)

1. It was and is possible to create a custom translation, but it will not effect the ErrorMessage on the Captcha object. Instead there is another way to add a custom error message.
First you must add a label where you want the Captcha error to appear. I added a label with the ID="labelCaptchaError" and the error Text="An danish error message".
In the PageLoad add the following check to determine if the label control were going to be visible or not.

protectedvoid Page_Load(object sender, EventArgs e)
    labelCaptchaError.Visible = !ReCaptcha.IsValid;

Then as long as the captcha control is valid the error message wont be showed.
In the button_clicked event I added the same check, but right before I called the method ReCaptcha.Validate() to validate the control.
Now I can check if the user has entered the right Captcha code. if it is valid then do something else the error label is visible and the error message shown.

2. The english ErrorMessage will automatically be shown in the ValidationSummary and to avoid that, I added a ValidationGroup to all other controls including the submitbutton.
This is also why a have to call the Validate() method in the button event.

After performing these steps I have a form with a Captcha control and it works.
I hope U can use this example. I will the next time I have to add a Captcha to a Form.