写在前面
断断续续,今天算是把验证码的东东弄出来了。
系列文章
[EF]vs15+ef6+mysql code first方式
[实战]MVC5+EF6+MySql企业网盘实战(2)——用户注册
[实战]MVC5+EF6+MySql企业网盘实战(2)——验证码
验证码类
using System;
using System.Collections.Generic;
using System.Drawing;
using System.IO;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
namespace Wolfy.NetDisk.Utilities
{
/// <summary>
/// 验证码类
/// </summary>
public static class VerifyCode
{
/// <summary>
/// 生成验证码
/// </summary>
/// <param name="len">验证码长度</param>
/// <param name="strCode">验证码</param>
/// <returns>验证码图片</returns>
public static byte[] Create(int len, out string strCode)
{
MemoryStream stream = new MemoryStream();
byte[] buffer = null;
//噪线 噪点
Color[] colors = { Color.Black, Color.Red, Color.Blue, Color.Green, Color.Orange, Color.Brown, Color.DarkBlue };
//验证码字体
string[] fonts = { "Times New Roman", "MS Mincho", "Book Antiqua", "Gungsuh", "PMingLiU", "Impact" };
//验证码内容
char[] charactars = { '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', 'S', 'Y', 'Z' };
//生成验证码字符串
StringBuilder sb = new StringBuilder();
Random r = new Random();
for (int i = 0; i < len; i++)
{
char codeChar = charactars[r.Next(0, charactars.Length)];
sb.Append(codeChar);
}
strCode = sb.ToString();
using (Bitmap bitmap = new Bitmap(len * 25, 35))
{
using (Graphics g = Graphics.FromImage(bitmap))
{
g.Clear(Color.White);
for (int i = 0; i < 10; i++)
{
int x1 = r.Next(100);
int y1 = r.Next(40);
int x2 = r.Next(100);
int y2 = r.Next(40);
Color color = colors[r.Next(colors.Length)];
g.DrawLine(new Pen(color), x1, y1, x2, y2);
}
//将字符串画入图片
for (int i = 0; i < strCode.Length; i++)
{
string font = fonts[r.Next(fonts.Length)];
Font fnt = new Font(font, 18);
Color color = colors[r.Next(colors.Length)];
g.DrawString(strCode[i].ToString(), fnt, new SolidBrush(color), (float)i * 20 + 8, (float)8);
}
//画噪点
for (int i = 0; i < 100; i++)
{
int x = r.Next(bitmap.Width);
int y = r.Next(bitmap.Height);
Color color = colors[r.Next(colors.Length)];
bitmap.SetPixel(x, y, color);
}
}
bitmap.Save(stream, System.Drawing.Imaging.ImageFormat.Jpeg);
buffer = stream.ToArray();
}
return buffer;
}
}
}
在UserInfoController中添加Action
[HttpGet]
public ActionResult VerifyCodeImage()
{
string strCode = string.Empty;
byte[] buffer = VerifyCode.Create(6, out strCode);
Session["code"] = strCode;
return File(buffer, @"image/jpeg");
}
注册页面上添加验证码的表单输入框
<div class="form-group">
<label class="control-label col-md-2">验证码</label>
<div class="col-md-10">
<input type="text" name="name" value=" " /> <img id="imgCode" style="cursor:pointer;" title="切换下一张" src="/UserInfo/VerifyCodeImage" alt="验证码" />
</div>
</div>
为验证码图片添加单击事件,切换下一张,为了避免缓存,添加随机数参数,保证每次请求是一次新的请求。
<script>
$(function () {
$("#imgCode").click(function () {
var ran = Math.random();
//加上随机数ran,避免验证码缓存。
this.src = "/UserInfo/VerifyCodeImage?_r=" + ran;
});
});
</script>
页面测试
总结
今天比平时早回来会儿,就趁着做了一个功能,进度有点慢啊。