Using ReCaptcha In ASP.NET WebForms And MVC

Re-captcha Logo

ReCaptcha is now being used widely by many websites especially where there is a possibility of spamming the website, blog or a forum. Here I will show you on how you can use ReCaptcha in ASP.NET and MVC. Get a ReCaptcha Gobal Key and ASP.NET ReCaptcha DLL. Once you get the global key we are ready to go.

ReCaptcha in WebForms

Fire Visual Studio and create a new ASP.NET web forms project. First add a ReCaptcha DLL in the project and as we are talking about a user control we will have to register the control. On the top of the page use the register directive to register the ReCaptcha control.

<%@ register tagprefix="recaptcha" namespace="Recaptcha" assembly="Recaptcha" %>

Now on the page, we will use the control.

<recaptcha:recaptchacontrol id="recaptcha" runat="server" publickey="public key"  privatekey="private key" />

You will get the public key and the private key when you register for the ReCaptcha global key. This will render the ReCaptcha control on the page.

Captcha control render

Notice that I have also placed a button and the label (with no text) on the page along with the ReCaptcha control. On the submit button we will check the Page.IsValid method. If the ReCaptcha text entered by the user is correct then the Page.IsValid method will return true else it will return false. Therefore the code on the submit button will be as follows:

if (Page.IsValid)
{
      lblStatus.Text = "Captcha Validated!";
}
else
{
      lblStatus.Text = "Invalid Captcha!";
}

This is it, hit F5 and try it out. We are now done implementing ReCaptcha in web forms and now we will see it in action in MVC.

ReCaptcha in MVC

Create a new MVC project in Visual Studio and I am using MVC 3 with RAZOR View Engine. To implement ReCaptcha in MVC, we will be using Microsoft Web Helpers. I assume you are aware of NuGet. Just in case if you are not aware of the Microsoft Web ` read my post on Working With Microsoft Web Helpers In MVC 3 Razor View. Microsoft web helpers allow us to use ReCaptcha in a very easy way. In WebForms we have used a DLL to render the ReCaptcha control on the page, but with Microsoft web helpers we can render the control with a single line of code. As you have used NuGet to install Microsoft Web Helpers library, make sure that you also use the correct namespace on the top of the page.

@using Microsoft.Web.Helpers;
 
@using (Html.BeginForm("Submit", "Home", FormMethod.Post))
{
    @ReCaptcha.GetHtml(publicKey: "<public key>", theme: "red")
}

I have rendered the control inside the form because when the data gets submitted after user enters the text the Submit method of the Home controller gets fired and check the captcha text entered by the user. As you know we have two keys with us, one is a public key and the other is a private key. We have used the public key to render the control on the page and we will now use the private key to validate the captcha. Also make sure that in order to use the ReCaptcha class on server side code you need to add the Microsoft.Web.Helpers namespace.

[HttpPost]
public ActionResult Submit()
{
        if (ReCaptcha.Validate(privateKey: "<private key>"))
        {
             return Content("Valid Captcha");
        }
        else
       {
            return Content("InValid Captcha");
       }
}

The ReCaptcha class of the web helpers provides a method to validate the entered text by the user. The private key of the ReCaptcha is passed as a parameter in order to validate the captcha text.

Using ReCaptcha with ASP.NET WebForms or MVC is pretty simple and easy. Here are some of the links which I feel you might find useful.

comments powered by Disqus