Cómo crear un Captcha con ASP.NET

Primero que nada debemos saber "¿Qué es un captcha?" Y "¿Para qué lo usamos?" La mayoría de los sitios web tienen la validación Captcha.

Código Captcha es simplemente una combinación de algunos números y caracteres que ayuda a validar el envió de un mensaje o comentario.

Lo usamos para validar que una tarea  específica fue realmente escrita por un humano, por medio de un código que nos genera el captcha.

Manos a la obra, vamos a entrar en el tema, es decir la creación de tu propio código Captcha en ASP.Net.

Paso 1: Crea una página en visual studio llamada "CaptchCode.aspx" y añade el código fuente en el diseño de la página, como se muestra a continuación.

<div>
            <table>
                <tr>
                    <td>
                        <asp:Image ID="imgCaptcha" runat="server" 
                            ImageUrl="~/CreateCaptcha.aspx?New=1" />
                    </td>
                </tr>
                <tr>
                    <td>
                        <asp:TextBox ID="txtCaptcha" runat="server">
                        </asp:TextBox>
                    </td>
                </tr>
                <tr>
                    <td>
                        <asp:Label ID="lblMessage" runat="server">
                        </asp:Label>
                    </td>
                </tr>
                <tr>
                    <td>
                        <asp:Button ID="btnCaptcha" runat="server" 
                            Text="Validar captcha" OnClick="btnCaptcha_Click" />
                    </td>
                </tr>
            </table>
        </div>

Nota: - Como puedes ver hay una Imagen  que me dan la ImageUrl = "~/CreateCaptcha.aspx?New= 1". Del control de imagen en CreateCaptcha.aspx vamos a escribir código para generar el código Captcha.

Paso 2: Ahora agrega una nueva página en tu aplicación "CreateCaptcha.aspx" y crea los métodos siguientes en su CreateCaptcha.aspx.vb

Imports System.Drawing
Imports System.Drawing.Imaging
Public Class CreateCaptcha
    Inherits System.Web.UI.Page
    Private rand As New Random()
    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        If Not Page.IsPostBack Then
            CreateCaptchaImage()
        End If
    End Sub

    ''' <summary>
    ''' method for create captcha image
    ''' </summary>
    Private Sub CreateCaptchaImage()
        Dim code As String = GetRandomText()
        Dim bitmap As New Bitmap(200, 60, System.Drawing.Imaging.PixelFormat.Format32bppArgb)
        Dim g As Graphics = Graphics.FromImage(bitmap)
        Dim pen As New Pen(Color.Yellow)
        Dim rect As New Rectangle(0, 0, 200, 60)
        Dim blue As New SolidBrush(Color.DarkRed)
        Dim black As New SolidBrush(Color.White)
        Dim counter As Integer = 0
        g.DrawRectangle(pen, rect)
        g.FillRectangle(blue, rect)

        For i As Integer = 0 To code.Length - 1
            g.DrawString(code(i).ToString(), _
                         New Font("Tahoma", 10 + rand.[Next](15, 20), _
                         FontStyle.Italic), black, New PointF(10 + counter, 10))
            counter += 28
        Next
        DrawRandomLines(g)
        bitmap.Save(Response.OutputStream, ImageFormat.Gif)
        g.Dispose()
        bitmap.Dispose()

    End Sub
    ''' <summary>
    ''' Method for drawing lines
    ''' </summary>
    ''' <param name="g"></param>
    Private Sub DrawRandomLines(g As Graphics)
        Dim yellow As New SolidBrush(Color.Yellow)
        For i As Integer = 0 To 19
            g.DrawLines(New Pen(yellow, 1), GetRandomPoints())
        Next

    End Sub
    ''' <summary>
    ''' method for gettting random point position
    ''' </summary>
    ''' <returns></returns>
    Private Function GetRandomPoints() As Point()
        Dim points As Point() = {New Point(rand.[Next](0, 150), rand.[Next](1, 150)), _
                                 New Point(rand.[Next](0, 200), rand.[Next](1, 190))}
        Return points
    End Function
    ''' <summary>
    ''' Method for generating random text of 5 cahrecters as captcha code
    ''' </summary>
    ''' <returns></returns>
    Private Function GetRandomText() As String
        Dim randomText As New StringBuilder()
        Dim alphabets As String = "012345679ACEFGHKLMNPRSWXZabcdefghijkhlmnopqrstuvwxyz"
        Dim r As New Random()
        For j As Integer = 0 To 5
            randomText.Append(alphabets(r.[Next](alphabets.Length)))
        Next
        Session("CaptchaCode") = randomText.ToString()
        Return TryCast(Session("CaptchaCode"), [String])
    End Function

End Class

Paso 3: Validación de código Captcha en la página " CaptchCode.aspx.vb".

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        If Not Page.IsPostBack Then
            imgCaptcha.ImageUrl = "~/CreateCaptcha.aspx?New=1"
        End If
    End Sub

    Protected Sub btnCaptcha_Click(sender As Object, e As EventArgs) Handles btnCaptcha.Click
        imgCaptcha.ImageUrl = "~/CreateCaptcha.aspx?New=0"
        If Session("CaptchaCode") IsNot Nothing AndAlso _
            txtCaptcha.Text = Session("CaptchaCode").ToString() Then
            lblMessage.ForeColor = Color.Green
            lblMessage.Text = "Código Captcha correcto!!"
        Else
            lblMessage.ForeColor = Color.Red
            lblMessage.Text = "Código Captcha erroneo, intentelo nuevamente!!"
        End If
    End Sub

Con estos tres sencillos pasos ya tienes un Captcha, si tienes algún comentario o una duda escríbenos y pronto te estaremos respondiendo.

Saludos y gracias por leernos!!!