Click here to Skip to main content
13,896,986 members
Click here to Skip to main content
Add your own
alternative version

Tagged as


16 bookmarked
Posted 16 Nov 2012
Licenced CPOL

Make a Captcha Image Validation with Jquery and MVC

, 16 Nov 2012
Rate this:
Please Sign up or sign in to vote.
This code generates an image for captcha validation


The code snippets below show how to use a simple class to create a validation mechanism via captcha in ASP.NET, using Jquery and MVC.

Using the Code

The code consists of two parts that work together to make the code work.

The first is JavaScript that runs on the client and should be placed on the page header. It is responsible for making the request to the server.

Note: I must remember that this JavaScript code requires Jquery, which can be downloaded here.

<script type="text/javascript" language="javascript">
     $(document).ready(function () {
     function loadCaptcha() {
             type: 'GET', url: 'Home/generateCaptcha',
             contentType: "application/json; charset=utf-8",
             dataType: "json",
             cache: false,
             success: function (data) { $("#m_imgCaptcha").attr('src', data); },
             error: function (data) { alert("Error while loading captcha image") }

The second is C# runs on the server. That receives the request from the page, generates an image with the specified text. This text can be generated by a function embedded in class or can be specified by the developer. The text is saved in the Session and is used to validate the data entered by the user.

public ActionResult generateCaptcha()
           System.Drawing.FontFamily family = new System.Drawing.FontFamily("Arial");
           CaptchaImage img = new CaptchaImage(150, 50, family);
           string text = img.CreateRandomText(4) + " " + img.CreateRandomText(3);
           img.Image.Save(Server.MapPath("~") +
           this.Session.SessionID.ToString() + ".png",
           Session["captchaText"] = text;
           return Json(this.Session.SessionID.ToString() + ".png?t=" +
           DateTime.Now.Ticks, JsonRequestBehavior.AllowGet);

Here is an example of a captcha image generated using this code:

Advantages of Use

  • You know what's running on your server.
  • No special settings are needed.
  • It is not necessary use third party components that can fail.
  • It is fully customizable.


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

Software Developer (Senior) SIGE Cloud
Madagascar Madagascar
No Biography provided

You may also be interested in...

Comments and Discussions

GeneralThanks for the post. Pin
Sachin Makwana3-Jan-16 22:57
professionalSachin Makwana3-Jan-16 22:57 
Generaldoubts Pin
Member 107330967-Jul-15 16:09
memberMember 107330967-Jul-15 16:09 
QuestionThanks Pin
Zaheer A.M.22-Jan-15 2:11
professionalZaheer A.M.22-Jan-15 2:11 
QuestionThanks. Pin
zamkinos26-Dec-14 9:46
memberzamkinos26-Dec-14 9:46 
Questioncaptcha Pin
Member 1001380115-Jul-13 18:57
memberMember 1001380115-Jul-13 18:57 
AnswerRe: captcha Pin
gilvani16-Jul-13 0:29
membergilvani16-Jul-13 0:29 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Permalink | Advertise | Privacy | Cookies | Terms of Use | Mobile
Web01 | 2.8.190306.1 | Last Updated 16 Nov 2012
Article Copyright 2012 by gilvani
Everything else Copyright © CodeProject, 1999-2019
Layout: fixed | fluid