Saturday, August 10, 2019

How to implement simple Captcha in ASP.Net

Step - 1 : Create New Project.

Go to File > New > Project > Select asp.net web forms application > Entry Application Name > Click OK.

Step-2: Add a reference of "SRVTextToImage.dll".

Download SRVTextToImage.dll
Go to Solution Explorer > Right Click on References > Add Reference... > Browse > select "SRVTextToImage.dll" > OK. 

Step-3: Create a new Page & design for implement Captcha.

Go to Solution Explorer > Right Click on Project name form Solution Explorer > Add > New item > Select web form/ web form using master page under Web > Enter page name > Add.

Here I have created "Feedback.aspx"
HTML Code 
  1. <table>
  2. <tr>
  3. <td>Email ID : </td>
  4. <td><asp:TextBox ID="txtEmailID" runat="server" Width="300px"></asp:TextBox></td>
  5. </tr>
  6. <tr>
  7. <td>Your Feedback :</td>
  8. <td>
  9. <asp:TextBox ID="txtFeedback" runat="server" TextMode="MultiLine" Width="300px" Height="50px" />
  10. </td>
  11. </tr>
  12. <tr>
  13. <td>
  14. Security Code :
  15. </td>
  16. <td>
  17. <asp:Image ID="imgCaptcha" runat="server" ImageUrl="~/CaptchaImage.aspx" />
  18. </td>
  19. </tr>
  20. <tr>
  21. <td></td>
  22. <td>
  23. <asp:TextBox ID="txtCaptchaText" runat="server" Width="100px" /> [Type Security code here]
  24. </td>
  25. </tr>
  26. <tr>
  27. <td></td>
  28. <td>
  29. <asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClick="btnSubmit_Click"/>
  30. </td>
  31. </tr>
  32. <tr>
  33. <td></td>
  34. <td>
  35. <asp:Label ID="lblMessage" runat="server" />
  36. </td>
  37. </tr>
  38. </table>
HTML Code 

Step-4: Create a new Page for Generate Captcha Image.

Go to Solution Explorer > Right Click on Project name form Solution Explorer > Add > New item > Select web form under Web > Enter page name > Add.

Here I have created "CaptchaImage.aspx"

  1. <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="CaptchaImage.aspx.cs" Inherits="ASPCreateCaptcha.CaptchaImage" %>

[N:B: Delete all the html code from the page & Don't use master page ]

Step-5: write below code in page_load event of "CaptchaImage.aspx" for Generate Captcha Image.

Import the followings...

  1. using SRVTextToImage;
  2. using System.Drawing;
  3. using System.Drawing.Imaging;

  1. protected void Page_Load(object sender, EventArgs e)
  2. {
  3. CaptchaRandomImage CI = new CaptchaRandomImage();
  4. // GetRandomString Function return random text of your provided characters size
  5. string captchaText = CI.GetRandomString(5);
  6.  
  7. //GenearteImage function return image of the provided text of provided size
  8. //CI.GenerateImage(captchaText, 200, 50);
  9. //there is a overload function available for set color of the image
  10. Session["CaptchaText"] = captchaText;
  11. CI.GenerateImage(captchaText, 200, 50, Color.DarkGray, Color.White);
  12.  
  13. this.Response.Clear();
  14. this.Response.ContentType = "image/jpeg";
  15. CI.Image.Save(this.Response.OutputStream, ImageFormat.Jpeg);
  16. CI.Dispose();
  17. }

Step-6: Write below code in the button click event (in this page here Feedback.aspx) for validate captcha

Go to Solution Explorer > Right Click on Project name form Solution Explorer > Add > New item > Select web form/ web form using master page under Web > Enter page name > Add.


  1. protected void btnSubmit_Click(object sender, EventArgs e)
  2. {
  3. // Other Validation Here
  4.  
  5. // Here I will validate Captcha
  6. bool isCaptchaValid = false;
  7. if (Session["CaptchaText"] != null && Session["CaptchaText"].ToString() == txtCaptchaText.Text)
  8. {
  9. isCaptchaValid = true;
  10. }
  11.  
  12. if (isCaptchaValid)
  13. {
  14. lblMessage.Text = "Captcha Validation Success";
  15. lblMessage.ForeColor = Color.Green;
  16. }
  17. else
  18. {
  19. lblMessage.Text = "Captcha Validation Failed";
  20. lblMessage.ForeColor = Color.Red;
  21. }
  22.  
  23. // Write Remaining code here for perform insert / update etc...
  24. }

Step-7: Run Application.

No comments:

Post a Comment

How to register multiple implementations of the same interface in Asp.Net Core?

 Problem: I have services that are derived from the same interface. public interface IService { } public class ServiceA : IService { ...