Char Captcha Example

After Captcha validation

Math Captcha Example

What is Captcha ?

Captcha is the validation layer to recognize the type of user before sending the data to server.

What are the advantages of Captcha ?

There are so many tool which is used to send automated message. If you have not implemented Captcha in your feedback or user registration page then you will get so many spam message or user.
So main advantage of Captcha to avoid the spam message or users.

How to use Captcha in asp.net MVC ?
There are so many open source library available to perform this task. Even though you can write your own code to implement Captcha in your application. This is totally depend on you.
In this article i m going to use CapchaMVC library from NuGet Packages. It is very simple to use in application.

Step 1: Create the Empty Asp.net MVC application.

Step 2: Add the CapchaMVC library in Reference Layer like this.

Step 3: In Model layer add Feedback class and create the property like this

namespace MathCaptcha.Models
{
    public class Feedback
    {
        public int Id { get; set; }
        public string Title { get; set; }
        public string Comment { get; set; }

    }
}

Step 4: Create a HomeController and write the action method like this

using System.Web.Mvc;
using CaptchaMvc.HtmlHelpers;


namespace MathCaptcha.Controllers
{
    public class HomeController : Controller
    {

        public ActionResult Index()
        {
            return View();
        }

        [HttpPost]
        public ActionResult Index(string empty)
        {
            // Code for validating the Captcha
            if (this.IsCaptchaValid("Captcha is not valid"))
            {
               
                return RedirectToAction("ThankYouPage"); 
            }

            ViewBag.ErrMessage = "Error: captcha is not valid.";
            return View();
        }

        public ActionResult ThankYouPage() 
        {
            return View();
        }

    }
}

Note: don’t forget to use CaptchaMvc.HtmlHelpers Namespace. In post action method i have written code for Captcha validation.

Step 5: Now create the Index View like this

@using CaptchaMvc.HtmlHelpers
@using MathCaptcha;
@using CaptchaMvc;

@model MathCaptcha.Models.Feedback

@{
    ViewBag.Title = "Index";
}

@using (Html.BeginForm()) {
    @Html.ValidationSummary(true)

    <fieldset>
        <legend>Feedback</legend>

        <div class="editor-label">
            @Html.LabelFor(model => model.Title)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Title)
            @Html.ValidationMessageFor(model => model.Title)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Comment)
        </div>
        <div class="editor-field">
            @Html.TextAreaFor(model => model.Comment,5,40,null)
            @Html.ValidationMessageFor(model => model.Comment)
        </div>
   
        @Html.MathCaptcha()

        @*@Html.Captcha(3)*@
         <br />
        <p class="Error">  @ViewBag.ErrMessage </p>
        <p>
            <input type="submit" value="Send" />
        </p>
    </fieldset>
}

Note: Here if you will use @Html.MathCaptcha() helper class then it will generate mathmatical capcha. If you will use @Html.Captcha(3) helper class then it will generate Char Capcha. 3 is the length of Captcha.

Step 6: Create the ThankYouPage index like this

@model MathCaptcha.Models.Feedback

@{
    ViewBag.Title = "ThankYouPage";
}

<h2>ThankYouPage</h2>

<b> Thank you sending your valuable feedback to us.</b>

Point to remember

1. Just include CapchaMVC libray
2. Use the CaptchaMvc.HtmlHelpers namespace
3. Use MathCaptcha namespace for using mathCaptcha
4. Use CaptchaMvc namespace for using CharCapcha
5. For math Captcha use @Html.MathCaptcha() helper class
6. For Char Captcha use @Html.Captcha(3) helper class.

Summary:

Here we have seen how to use Captcha in asp.net MVC application. It is very simple and straight forward to implement in MVC apllication.