ASP.NET MVC5总结(四)登陆中常用技术解析之验证码

在应用软件中,登陆系统我们往往会用到验证码技术,下面将介绍在MVC中用到的验证码技术。

1.前端代码段及前端效果图如下

<div class="row">
<input id="txt_code" maxlength="4" type="text" placeholder="验证码" style="width: 190px; float: left;">
<div style="width: 110px; float: right; padding-top: 14px; padding-left: 14px;">
看不清?<a id="switchCode" href="javascript:void();" style="text-decoration: none;">换一张</a>
<img id="imgcode" class="authcode" src="~/Login/GetAuthCode" width="80" height="25" />
</div>
</div>

ASP.NET MVC5总结(四)登陆中常用技术解析之验证码

当验证码看不清楚时,我们点击换一张来进行验证码的替换,js代码如下:

$("#switchCode").click(function () {
$("#imgcode").attr("src", "/Login/GetAuthCode?time=" + Math.random());
});

2.服务端

我们需要引入程序集:using System.Web.Mvc;

前端调用代码如下:

[HttpGet]
public ActionResult GetAuthCode()
{
return File(new VerifyCode().GetVerifyCode(), @"image/Gif");
}

具体实现类如下:

public class VerifyCode
{
public byte[] GetVerifyCode()
{
int codeW = ;
int codeH = ;
int fontSize = ;
string chkCode = string.Empty;
//颜色列表,用于验证码、噪线、噪点
Color[] color = { Color.Black, Color.Red, Color.Blue, Color.Green, Color.Orange, Color.Brown, Color.Brown, Color.DarkBlue };
//字体列表,用于验证码
string[] font = { "Times New Roman" };
//验证码的字符集,去掉了一些容易混淆的字符
char[] character = { '', '', '', '', '', '', '', '', '', 'a', 'b', 'd', 'e', 'f', 'h', 'k', 'm', 'n', 'r', 'x', 'y', 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'P', 'R', 'S', 'T', 'W', 'X', 'Y' };
Random rnd = new Random();
//生成验证码字符串
for (int i = ; i < ; i++)
{
chkCode += character[rnd.Next(character.Length)];
}
//写入Session、验证码加密
WebHelper.WriteSession("nfine_session_verifycode", Md5.md5(chkCode.ToLower(), ));
//创建画布
Bitmap bmp = new Bitmap(codeW, codeH);
Graphics g = Graphics.FromImage(bmp);
g.Clear(Color.White);
//画噪线
for (int i = ; i < ; i++)
{
int x1 = rnd.Next(codeW);
int y1 = rnd.Next(codeH);
int x2 = rnd.Next(codeW);
int y2 = rnd.Next(codeH);
Color clr = color[rnd.Next(color.Length)];
g.DrawLine(new Pen(clr), x1, y1, x2, y2);
}
//画验证码字符串
for (int i = ; i < chkCode.Length; i++)
{
string fnt = font[rnd.Next(font.Length)];
Font ft = new Font(fnt, fontSize);
Color clr = color[rnd.Next(color.Length)];
g.DrawString(chkCode[i].ToString(), ft, new SolidBrush(clr), (float)i * , (float));
}
//将验证码图片写入内存流,并将其以 "image/Png" 格式输出
MemoryStream ms = new MemoryStream();
try
{
bmp.Save(ms, ImageFormat.Png);
return ms.ToArray();
}
catch (Exception)
{
return null;
}
finally
{
g.Dispose();
bmp.Dispose();
}
}
}

通过上述代码,一个简单的验证码就可以实现了。

上一篇:页面中引入百度地图,实例化后影响html5的表单元素date的上下箭头


下一篇:像编程一样写文章—Markdown