如何使用ASP.NET制作简单的验证码

   2015-07-25 0
核心提示:当用户进行注册、登陆的时候都会遇到输入验证码的情况,那验证码到底是怎么产生的呐,本文就是介绍了如何使用ASP.NET制作简单的验证码,感兴趣的朋友可以参考一下

大家都知道验证码是以图片形式展示的,而且是动态生成的,这样就需要我们去画出它,那不得不提到是GDI+绘图了

科普一下,什么是GDI+?
GDI+是图形设备接口(GDI)的高级版本, 提供了各种丰富的图形图像处理功能。GDI+主要由二维矢量图形、图像处理和版式3部分组成。GDI+为使用各种字体、字号和样式来显示文本这种复杂任务提供了大量的支持。

下面说说验证码,对于验证码这样的图片,我觉得是由两部分组成的,一部分是矩形的背景,另一部分是在其上的字母数字组合(有的时候有汉字,有的时候是纯字母或者纯数字,这个没有统一规定,怎么选择看你~)。对于矩形的背景我们可以直接把其当成画布,字母数字组合呢?我们可以利用随机数去拼出一组新组合。这样整个过程我们都想好了,下面看下代码吧:
声明一下,我写的这个验证码为5个字符长度,由大小写英文字母+数字随机组合。

private readonly char[] constant = {  
   '0','1','2','3','4','5','6','7','8','9', 
   'a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z',  
   'A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z'};//一个由数字和大小写英文字母组成的字符数组
 
   protected void Page_Load(object sender, EventArgs e)
   {
     Bitmap bitmap = new Bitmap(100, 25);//创建一个位图,宽100,高25,就是我所说的第一部分,矩形背景
     Graphics g = Graphics.FromImage(bitmap);//创建画布
     g.Clear(Color.YellowGreen);//为画布填充黄绿色
 
     Font font1 = new Font("Arial", 15);//设置字体类型和大小 
     Brush brush = new SolidBrush(Color.Blue);//设置画刷颜色
     Pen myPen = new Pen(Color.Blue, 5);//创建画笔对象
 
     StringBuilder random = new StringBuilder(5); //创建可变字符串对象,用于存放随机生成的验证码
     Random rd = new Random();//创建一个随机数生成器对象
     for (int i = 0; i < random.Capacity; i++)
     {
      random.Append(constant[rd.Next(62)]);//生成一个随机字符加到random里
     }
 
      g.DrawString(random.ToString(), font1, brush, 10, 5);//在画布上画出字符串
 
      System.IO.MemoryStream ms = new System.IO.MemoryStream();//创建数据流MemoryStream
      bitmap.Save(ms, System.Drawing.Imaging.ImageFormat.Gif);//指定图像的输出格式为gif
 
      Response.ClearContent();
      Response.ContentType = "image/Gif";
      Response.BinaryWrite(ms.ToArray());//输出二进制数据流
   }

生成的效果是这样的:

如何使用ASP.NET制作简单的验证码

大家可能会觉得这样看起来很容易辨识,跟我们平时登录网站时输入的验证码比起来有点像个小学生。当然,我们可以做些改变,比较加上一定的角度。

private readonly char[] constant = {  
   '0','1','2','3','4','5','6','7','8','9', 
   'a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z',  
   'A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z'};//一个由数字和大小写英文字母组成的字符数组
 
   protected void Page_Load(object sender, EventArgs e)
    {
      Bitmap bitmap = new Bitmap(100, 25);//创建一个位图,宽100,高25,就是我所说的第一部分,矩形背景
      Graphics g = Graphics.FromImage(bitmap);//创建画布
      g.Clear(Color.YellowGreen);//为画布填充黄绿色
 
      Font font1 = new Font("Arial", 15);//设置字体类型和大小 
      float angle = 60;//旋转的一个基础角度
      float length = 0;//显示字符的基础位置,往后看
      Brush brush = new SolidBrush(Color.Blue);//设置画刷颜色
      Pen myPen = new Pen(Color.Blue, 5);//创建画笔对象
 
      StringBuilder random = new StringBuilder(5); //创建可变字符串对象,用于存放随机生成的验证码
      Random rd = new Random();//创建一个随机数生成器对象
      for (int i = 0; i < random.Capacity; i++)
      {
        random.Append(constant[rd.Next(62)]);//生成一个随机字符加到random里
 
        g.ResetTransform();//将画布重置矩阵
        SizeF size = g.MeasureString(random[random.Length - 1].ToString(), font1);//得到新生成字符的尺寸
        g.TranslateTransform(length + size.Width / 2, size.Height / 2);//选择此次旋转的中心位置
        g.RotateTransform((float)rd.NextDouble() * angle * 2 - angle);//进行随机角度旋转
        g.DrawString(random[random.Length - 1].ToString(), font1, brush, new PointF(-size.Width / 2, -size.Height / 2));//注意,这里不是前一个例子,一次性把5个字符全部画出来,而是一个一个画
        length += size.Width;//保证下次画字符的位置不会覆盖前一次的字符
      }
 
      System.IO.MemoryStream ms = new System.IO.MemoryStream();//创建数据流MemoryStream
      bitmap.Save(ms, System.Drawing.Imaging.ImageFormat.Gif);//指定图像的输出格式为gif
 
      Response.ClearContent();
      Response.ContentType = "image/Gif";
      Response.BinaryWrite(ms.ToArray());//输出二进制数据流
   }

这时生成的效果是这样的:

如何使用ASP.NET制作简单的验证码

是不是看起来更专业一些了呢?如果大家还是觉得不满意的话,可以看下GDI+的相关内容,通过添加一些噪点的元素,或者删除线这样子的东西来达到提高识别难度的目的,我这里就不一一列举啦。
关于如何画验证码我们说过了,但是还有两点问题我还是想多说一下。
1、我们实际输出的是一个二进制的流,如何做到显示到页面上与页面其他元素共存呢?
这里通用的一种方法就是把画验证码的这段代码放到一个独立的Web窗体页中,在另一个需要显示验证码的页面放一个<img>元素,把其src属性指向该验证码页的url。比如我写的一段是这样:

复制代码 代码如下:

<asp:Image ID="image_validatecode" runat="server" ImageUrl="~/PublicMethod/ValidateCode.aspx" style="padding-left:3px"/>

其实这里我是用大家通用的方法,不过我先前也有单独写一个web自定义控件,专门生成验证码使用,但是当拖入到页面中后运行,它还是会把页面其他元素给覆盖掉,具体原因我也不清楚。

2、验证码主要目的还是用于验证使用的,所以我们在用户名,密码是否合法外,同时也要判断当前输入的验证码是不是与图片上的验证码一致。
我上面的代码中并没有写这块,其实只要在随机生成最终验证码之后,把其值存入一个session中去就可以了。然后在判断用户名,密码的同时去比较一下这个session值就OK了。如:

复制代码 代码如下:

Session["login_validate_code"] = random.ToString();

3、如何用户没有看清此张验证码,想换一张如何实现?
可以通过脚本给img元素的src属性重新赋值url实现,当然,麻烦点的话也可以使用ajax去实现。大家可以自己试试。

以上就是本文给大家分享的制作验证码的全部过程,希望大家能够喜欢。

 
反对 0举报 0 评论 0
 

免责声明:本文仅代表作者个人观点,与乐学笔记(本网)无关。其原创性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
    本网站有部分内容均转载自其它媒体,转载目的在于传递更多信息,并不代表本网赞同其观点和对其真实性负责,若因作品内容、知识产权、版权和其他问题,请及时提供相关证明等材料并与我们留言联系,本网站将在规定时间内给予删除等相关处理.

  • 这个Spring Security登录插件牛啊,验证码、小程序、OAuth2都能快速接入
    这个Spring Security登录插件牛啊,验证码、小
    上次我们把验证码登录、小程序登录优雅地集成到了Spring Security,很多同学大呼过瘾,相比较一些传统玩法高级了很多。胖哥就赶紧抓住机会举一反三,把几个非标准的OAuth2也接入了进来,主要是微信、企业微信,做到应接尽接。只需要通过下面几行简单的代码就
    02-09 java
  • Matlab神经网络验证码识别
    Matlab神经网络验证码识别
    本文,将会简述如何利用Matlab的强大功能,调用神经网络处理验证码的识别问题。 预备知识,Matlab基础编程,神经网络基础。 可以先看下:Matlab基础视频教程Matlab经典教程——从入门到精通神经网络入门验证码识别原理Matlab对图像读入处理,去掉噪声点和较
    02-09
  • ionic typescript--验证码发送倒计时功能
    1.新建页面ionic g page forget 2.mode.html文件ion-itemion-input clearInput [(ngModel)]='code' placeholder='请输入验证码'/ion-inputbutton clear ion-button class="i" item-end (tap)="getCode()" [disabled]="!verifyCode.disable&
    02-09
  • Nodejs简单验证码ccap安装 nodejs生成验证码
    首先要求:  node  npm安装时如果提示npm-gyp失败,可进行如下操作:确认python版本2.7+安装npm install ccap如果失败,尝试npm install ccap@0.5.3
    02-09
  • VB.NET验证码生成代码
    VB.NET验证码生成代码
    前台代码为:    asp:image id="Image2" runat="server" ImageUrl="ValidateCode.aspx"ValidateCode.aspx文件的代码为:        Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase
    02-09
  • 教你用Python实现短信验证码的发送
    教你用Python实现短信验证码的发送
    目录1. 短信API平台2. 使用官方提供的SDK实现短信发送2.1 安装SDK2.2 使用官方的测试用例进行测试2.3 参数及其参数的查看3. 单例模式实现短信发送总结1. 短信API平台使用的短信API平台为:容联云(https://www.yuntongxun.com/)开发者文档:http://doc.yuntong
  • Python使用Cv2模块识别验证码的操作方法
    Python使用Cv2模块识别验证码的操作方法
    目录业务需求需求分析代码一结果分析 代码二代码模块结果呈现总结经验 参考文献业务需求        识别验证码图片中的数字信息,用python的图形表示出来了需求分析        使用Cv2模块、pytesseract模块进行操作。CV2是计算机建模识别的库,
  • asp.net mvc 短信验证码
    asp.net mvc 短信验证码
      把发短信功能写成一个类包,需要引用:SmsUtillity.cs:using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Net;using System.IO;//到吉信通申请试用账号namespace ProcuracyRoom.Dll{public sealed class
    02-09
  • 用C#(asp.net)写出登录验证码! 用chatGPT
    /* Copyright all(c) 2005 ZhongFeng, http://blog.csdn.net/SW515 */ public class ValidateCode : System.Web.UI.Page {  private void Page_Load(object sender, System.EventArgs e)  {   this.CreateCheckCodeImage(GenerateCheckCode());  }
    02-09
  • ASP.net生成各种随机数字,用于优惠券、验证码
    北京网站建设-恒动时空将网上查到的资料收集整理如下:1、利用GUID生成全球唯一标识符,长度为32位,格式如:6F9619FF-8B86-D011-B42D-00C04FC964FF。    SQLSERVER本身可以生成,ASP.NET也可以生成。    最简单的如:GUID guid = Guid.newguid()2、
    02-09
点击排行