How to create the Capture Image || Login Image authentication creation in asp.net c#

How to create the Capture Image || Login Image authentication creation in asp.net c#

Step 1:- Create one asp page and name it as CaptureImage.aspx

In .CS file write below code

namespace IDMSUI

{

    public partial class CaptureImage : System.Web.UI.Page

    {

        protected void Page_Load(object sender, EventArgs e)

        {

            GetCaptureImage();

        }

        public void GetCaptureImage()

        {

            using (Bitmap b = new Bitmap(150, 40, PixelFormat.Format32bppArgb))

            {

                using (Graphics g = Graphics.FromImage(b))

                {

                    Rectangle rect = new Rectangle(0, 0, 149, 39);

                    //Rectangle rect = new Rectangle(0, 0, 100, 25);

                    g.FillRectangle(Brushes.White, rect);

                    // Create string to draw.

                    Random r = new Random();

                    int startIndex = r.Next(1, 5);

                    int length = r.Next(5, 10);

                    String drawString = Guid.NewGuid().ToString().Replace("-", "0").Substring(startIndex, length);

                    Session["CaptureImageCode"] = drawString;

                    // Create font and brush.

                    Font drawFont = new Font("Arial", 16, FontStyle.Italic);

                    //Font drawFont = new Font("Arial", 16, FontStyle.Italic | FontStyle.Strikeout);

                    //Font drawFont = new Font("Arial", 16, FontStyle.Italic);

                    using (SolidBrush drawBrush = new SolidBrush(Color.Black))

                    {

                        // Create point for upper-left corner of drawing.

                        PointF drawPoint = new PointF(15, 10);

                        // Draw string to screen.

                        g.DrawRectangle(new Pen(Color.Red, 0), rect);

                        g.DrawString(drawString, drawFont, drawBrush, drawPoint);

                    }

                    //b.Save(context.Response.OutputStream, ImageFormat.Jpeg);

                    //context.Response.ContentType = "image/jpeg";

                    //context.Response.End();

                    this.Response.Clear();

                    this.Response.ContentType = "image/jpeg";

                    // Write the image to the response stream in JPEG format.

                    b.Save(this.Response.OutputStream, ImageFormat.Jpeg);

                    // Dispose of the CAPTCHA image object.

                    b.Dispose();

                }

            }

        }

    }

}

Step 2:- Call that image page in another like

<asp:Image ID="imgCaptcha" runat="server" ClientIDMode="Static" ImageUrl="~/CaptureImage.aspx" Width="100px" Height="30px" />

This is the process assign the capture image path to image URL path

ImageUrl="~/CaptureImage.aspx"

For every time reload use this JQUERY code for auto load

<script type="text/javascript">

        $(document).ready(function () {

            var URL = $("#imgCaptcha")[0].src;

            $("#imgCaptcha")[0].src = URL + "?sample=" + new Date();

        });

</script>

JQUERY Description : This code explains when we pass the url with different parameters it will automatically refresh the image.

Step 3:- In code file you can check the capture code like

if (Session["CaptureImageCode"].ToString() != txtCodeValidate.Text)

{

       Return true;

}

Else

Return false;