Monday 10 June 2013

How can we use a Captcha in Asp.net

How can we use a Captcha in Asp.net
Captcha

What is a captcha how can we use them with either a handler file or .dll file in asp.net 4.0
This article demonstrates how to create such an Captcha image and employ it within an ASP.NET web form.
 What is..?
          - [completely automated public Turing test to tell computers and humans apart] is a program that can tell humans from machines using some type of generated test. A test most people can easily pass but a computer program cannot.You've probably encountered such tests when signing up for an online email or forum account. The form might include an image of distorted text, like that seen above, which you are required to type into a text field. t
The idea is to prevent spammers from using web bots to automatically post form data in order to create email accounts (for sending spam) or to submit feedback comments or guestbook entries containing spam messages. The text in the image is usually distorted to prevent the use of OCR (optical character reader) software to defeat the process. Hotmail, PayPal, Yahoo and a number of blog sites have employed this technique.
you can download a complete captcha program from here  [Link]
 Files we need...!
  •  JpegImage_CS.aspx and JpegImage_CS.aspx .cs- defines the CapchaImage object which actually creates the image. 
  •  captcha.aspx, captcha.aspx.cs - a sample web form.
    button-refresh-captcha.jpg [ an image for button refresh ]
  • Refer the assembly CaptchaDLL.dll in your project --as you can download from here....! CaptchaDLL.dll 
Step 1: Add a page file in your web application and name it "captcha.aspx". It will be used to create Textbox,CAPTCHA image as a bitmap using a class and a dll file. Add following code in the .aspx file: 
  
veryfication styling 
<%--Verification
         
Please type the characters you see in the picture :
           
--%>
and

put the following src into a ImageButton!

 runat="server" Height="31px" 
   ImageUrl="~/SrcPic/button-refresh-captcha.jpg" OnClick="ibtnRefresh_Click" 
        ToolTip="Click here to load a new image" Width="32px" />
                             

and a text box with an id  txtCaptcha

          TextBox ID="txtCaptcha" runat="server" BorderColor="Silver" 
     BorderStyle="Solid" BorderWidth="1px" CssClass="style82" Height="20px" 
                                    Width="145px">

and with a button
               

Button ID="Button1" runat="server" onclick="Button1_Click" Text="Check" />
                            



Step 2 :
 Now a .aspx file in your web application and name it "JpegImage_CS.aspx ". This  file implements a custom web control which displays the bitmap CAPTCHA image created by the "CaptchaDLL.dll" . Add following code in this file (in the source code itself):
<%@ Page Language="C#" %>
<%@ Import Namespace="System.Drawing.Imaging" %>
<%@ Import Namespace="CaptchaDLL" %>

and within script paste following codes

private void Page_Load(object sender, System.EventArgs e)
    {
        if (Session["CaptchaImageText"] != null)
        {
            // CREATE A CAPTCHA IMAGE USING THE TEXT STORED IN THE SESSION OBJECT.
            CaptchaImage ci = new CaptchaImage(Session["CaptchaImageText"].ToString(), 200, 50);
           
            //YOU CAN USE THE OTHER OVERLOADED METHODS ALSO
            //CaptchaImage ci = new CaptchaImage(Session["CaptchaImageText"].ToString(), 200, 50, "Courier New");
            //CaptchaImage ci = new CaptchaImage(Session["CaptchaImageText"].ToString(), 200, 50, "Courier New" ,System.Drawing.Color.White, System.Drawing.Color.Red);
           
            // Change the response headers to output a JPEG image.
            this.Response.Clear();
            this.Response.ContentType = "image/jpeg";

            // Write the image to the response stream in JPEG format.
            ci.Image.Save(this.Response.OutputStream, ImageFormat.Jpeg);

            // Dispose of the CAPTCHA image object.
            ci.Dispose();
        }
    }






   


Step3: 

Now define a namespace for the created CAPTCHA dll. To do this, locate the tags in the captcha.aspx.cs file and add a namespace tag as below:
 using System.Data;
using System.Data.SqlClient;
using System.Configuration;
using System.IO;
using System.Collections;
using System.ComponentModel;
using System.Drawing;
using System.Web.SessionState;
using System.Web.UI.HtmlControls;

using CaptchaDLL;
   

Step4: 

 Now add the code behind in the web page where CAPTCHA image needs to be displayed. Following code snippet can be used:
  

  1. protected void Page_Load(object sender, EventArgs e)  
  2.   
  3.     {  
  4.   
  5.         if (!IsPostBack)  
  6.   
  7.          
  8.   
  9. { Session["CaptchaImageText"] = CaptchaImage.GenerateRandomCode(CaptchaType.AlphaNumeric, 6);  
  10.   
  11.  //creating the strting to show in CAPTCHA image  
  12.   
  13.             
  14.   
  15.         }  
  16.   
  17.         //cnn = new SqlConnection(ConfigurationManager.ConnectionStrings["con"].ConnectionString);  
  18.   
  19.         //cnn.Open();  
  20.   
  21.     }  
  22.   
  23.     protected void ibtnRefresh_Click(object sender, ImageClickEventArgs e)  
  24.   
  25.     {  
  26.   
  27.         Session["CaptchaImageText"] = CaptchaImage.GenerateRandomCode(CaptchaType.AlphaNumeric, 6); //generate new string  
  28.   
  29.     }  
  30.   
  31.     protected void Button1_Click(object sender, EventArgs e)  
  32.   
  33.     {  
  34.   
  35.         if (Session["CaptchaImageText"] != null &amp;&amp; txtCaptcha.Text.ToLower() == Session["CaptchaImageText"].ToString().ToLower())  
  36.   
  37.         {  
  38.   
  39.             Label1.Text="Well done captcha passed..!";  
  40.   
  41.                   }  
  42.   
  43.         else  
  44.   
  45.         {  
  46.   
  47.             Session["CaptchaImageText"] = CaptchaImage.GenerateRandomCode(CaptchaType.AlphaNumeric, 6);  
  48.   
  49.             txtCaptcha.Text = "";  
  50.   
  51. Label1.Text=" Enter correct characters as shown in image...!";  
  52.   
  53.                }  
  54.   
  55.     }  
Visual Verification---  

No comments:

Post a Comment