MVC中生成图形验证码并验证（详细）
Posted lfq761204
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了MVC中生成图形验证码并验证（详细）相关的知识，希望对你有一定的参考价值。
一、思路
1.生成验证码
通过Random对象生成随机数 ，通过Session对象保存生成的随机验证码，通过Graphics绘图对象在Bitmap位图上进行绘制，并将绘成功的位图对象转换为字节数组，最后返回该字节数组。
2.显示并验证
在控制器中编写读取验证码字节数组的方法，返回FileResult对象并通过视图中img控件显示。通过读取生成验证码时写入的Session对象的值，与从视图中获取的输入值进行比较判断验证码输入是否正确。
二、代码
1.生成验证码图形的核心代码，建议将该类建立在根目录下的自定义目录Common中。
using System;
using System.Drawing;
using System.Drawing.Drawing2D;
using System.Drawing.Imaging;
using System.IO;
using System.Web;
namespace XLZXXX.Common {
public class VerificationCode {
public static byte[] GetCodeImage() {
//生成随机验证码
//定义验证码字符库，0和1容易与字母o和i混淆，尽量不用
char[] codesSource = { '2','3','4','5','6','7','8','9' };
int codesLength = 4; //验证码字符个数
char[] codes = new char[codesLength]; //验证码字符数组
Random rnd = new Random(); //定义一个随机数生成器
//生成随机验证码
for(int i = 0;i<codesLength;i++) {
//从验证码字符库里随机取一个字符赋值给验证码的第i个字符
codes[i]=codesSource[rnd.Next(codesSource.Length)];
}
//将生成的验证码字符串赋值给Session对象
HttpContext.Current.Session["VerificationCode"]=string.Join("",codes);
//定义验证码图片对象
int charSize = 24; //验证码字符大小
int imgWidth = charSize*(codesLength+1); //生成验证码图片的宽度
int imgHeight = charSize*2; //生成验证码图片的高度
Bitmap bmp = new Bitmap(imgWidth,imgHeight);
Graphics g = Graphics.FromImage(bmp);
g.Clear(Color.White);
//在背景上添加噪线
for(int i = 0;i<20;i++) {
int x1 = rnd.Next(imgWidth), y1 = rnd.Next(imgHeight);
int x2 = rnd.Next(imgWidth), y2 = rnd.Next(imgHeight);
//随机线颜色随机，宽度在1和2值之间随机
Pen pen = new Pen(Color.FromArgb(rnd.Next()),rnd.Next(1,3));
g.DrawLine(pen,x1,y1,x2,y2);
}
//添加验证码字符
Font font = new Font("黑体",charSize,FontStyle.Bold);
//定义一个渐变颜色的笔刷
LinearGradientBrush brush = new LinearGradientBrush(new Rectangle(0,0,charSize,charSize),Color.LightGreen,Color.Red,1.5F);
for(int i = 0;i<codesLength;i++) {
//重新定义一个位图对象和绘图对象，画随机旋转的单个字符
Bitmap bmp1 = new Bitmap(charSize*3,charSize*3);
Graphics g1 = Graphics.FromImage(bmp1);
Matrix matrix = new Matrix(); //定义一个矩阵对象来旋转字符
//沿参数中指定定随机旋转-30到30度之间的角度
matrix.RotateAt(rnd.Next(-30,30),new Point(charSize/2-4,charSize-4));
g1.Transform=matrix;
//画单个字符，并把生成的图形画到验证码图形对象上
g1.DrawString(codes[i].ToString(),font,brush,0,0);
g.DrawImage(bmp1,charSize/2+charSize*i,(imgHeight-charSize)/2);
g1.Dispose();
}
//在前景上添加噪点
for(int i = 0;i<250;i++) {
int x = rnd.Next(imgWidth), y = rnd.Next(imgHeight);
bmp.SetPixel(x,y,Color.FromArgb(rnd.Next()));
}
//画验证码的边框
g.DrawRectangle(new Pen(Color.Black),0,0,imgWidth-1,imgHeight-1);
//将图形对象写入内存流，并返回内存流的字节数组
MemoryStream ms = new MemoryStream();
bmp.Save(ms,ImageFormat.Jpeg);
g.Dispose();bmp.Dispose();
return ms.ToArray();
}
}
}2.控制器代码
using System.Web.Mvc;
using XLZXXX.Common;
namespace XLZXXX.Controllers {
public class LoginController : Controller{
public ActionResult Index(){
return View();
}
//返回验证码图形内容，提供给视图img控件显示
public FileResult GetVerificationCode() {
return new FileContentResult(VerificationCode.GetCodeImage(),"image/jpeg");
}
//验证输入的验证码是否正确
//通过读取生成验证码时写入的Session对象的值与从视图中获取的输入值进行比较
public string CheckVerificationCode(string code) {
string sessionCode = Session["VerificationCode"]==null ? "" : Session["VerificationCode"].ToString();
if(sessionCode==code)
return "验证码正确。";
else
return "验证码错误，请重新输入。";
}
}
}3.视图代码
@{Layout = null;}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>MVC中生成图形验证码并验证（详细）</title>
<script src="~/Scripts/jquery.min.js"></script>
<script>
$(function() {
$("#img").click(function() {
//src属性值后加参数是为了避免浏览器的缓存机制
$(this).prop("src","/Login/GetVerificationCode?t="+new Date().getTime());
});
$("#btnCheck").click(function () {
$.ajax({
url: "/Login/CheckVerificationCode",
type: "post",
data: { code: $("#txtCode").val() }, //参数名code要和控制器CheckVerificationCode的参数名相同
success: function (data) {
alert(data);
$("#img").click(); //刷新验证码
}
});
});
});
</script>
</head>
<body>
<p><img src="/Login/GetVerificationCode" id="img" />点击图片验证码可以刷新</p>
<p><input type="text" id="txtCode" /> <input type="button" id="btnCheck" value="验证" /></p>
</body>
</html>
以上是关于MVC中生成图形验证码并验证（详细）的主要内容，如果未能解决你的问题，请参考以下文章