ASP.Net中四位数字验证码的实现

    以前看到别人生成的图片验证码,总有一种高大上的感觉,最近试了下,发觉其实也不难,很简单的一个小功能。不过这里我只能是生成数字,至于我们经常见的字母、汉字什么的还不知道怎么实现,有待进一步研究。

    首先看前台的代码,这里我用webForm中的aspx页面:

        <asp:Label ID="Label1" runat="server" Text="验证码:"></asp:Label>
        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox><img src="ValidateCode.ashx" οnclick="this.src='ValidateCode.ashx?'+new Date()"/>
        <br/>
        <asp:Button ID="Button1" runat="server" Text="验证" OnClick="Button1_Click" />

    这里,只是用了一个Label,一个TextBox,一个Image和一个Button按钮。TextBox用来输入显示的验证码,Image用来显示验证码,点击Button按钮对输入的验证码正确与否进行验证。这里要注意的是img控件中它的链接地址是一个一般处理程序,我们将在这个一般处理程序中生成验证码;它还有一个onclick事件,在onclick事件中设置它的链接地址,设置链接地址的同时加上一个 new Date(); 这样就可以使它点击时,每隔一秒产生一个新的验证码。

    然后我们再看一般处理程序ValidateCode.ashx中是如何生成这个验证码的:

            context.Response.ContentType = "image/jpeg";//输出类型设置为image/jpeg
            using(Bitmap bitmap = new Bitmap(60,30))    //大小设置为宽60px,高30px
            {
                using (Graphics g = Graphics.FromImage(bitmap) )
                {
                    Random random = new Random();  //生成一个随机数
                    string strCode = random.Next(1000, 9999).ToString();  //把这个随机数设置为四位
                    context.Session["Code"] = strCode;   //把生成的验证码存在Session中,等到验证的时候再使用
                    g.DrawString(strCode,new Font("楷体",12),Brushes.Red,20,10);  //设置验证码的字体及大小以及颜色
                }
                bitmap.Save(context.Response.OutputStream,System.Drawing.Imaging.ImageFormat.Jpeg);
            }
    最后,当输入验证码后,点击Button按钮,判断输入到文本框中的值与Session中存的是否相同:

       protected void Button1_Click(object sender, EventArgs e)
        {
            if (Session["Code"].ToString() == TextBox1.Text)//判断文本框的值与Session中存的值是否相同
            {
                Response.Write("验证成功!");//相同则验证成功
            }
            else
            {
                Response.Write("验证错误!");//不同则验证错误 
            }
        }
    界面如下图所示,有点丑,凑合着看吧!

    


  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

夜未央5788

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值