视频1 视频21 视频41 视频61 视频文章1 视频文章21 视频文章41 视频文章61 推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37 推荐39 推荐41 推荐43 推荐45 推荐47 推荐49 关键词1 关键词101 关键词201 关键词301 关键词401 关键词501 关键词601 关键词701 关键词801 关键词901 关键词1001 关键词1101 关键词1201 关键词1301 关键词1401 关键词1501 关键词1601 关键词1701 关键词1801 关键词1901 视频扩展1 视频扩展6 视频扩展11 视频扩展16 文章1 文章201 文章401 文章601 文章801 文章1001 资讯1 资讯501 资讯1001 资讯1501 标签1 标签501 标签1001 关键词1 关键词501 关键词1001 关键词1501 专题2001
asp.net 图片验证码的HtmlHelper
2020-11-27 22:42:22 责编:小采
文档


一个图片验证码的HtmlHelper,原来的调用代码如下:
代码如下:

<img id="validateCode" mailto:src='@Url.Action(%22GetValidateCode%22)'/>
<script language="javascript" type="text/javascript">
$(document).ready(function () {
$("#validateCode").bind("click", function () {
var url = $(this).attr("src");
url += "?" + Math.random();
$(this).attr("src", url);
});
});
</script>

封装成HtmlHelper后:
@Html.ValidateCode()
使用步骤如下:
1.建一个验证码Helper
代码如下:

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System;
using System.Collections.Generic;
using System.Diagnostics.CodeAnalysis;
using System.Globalization;
using System.Linq.Expressions;
using System.Security.Policy;
using System.Text;
using System.Web;
using System.Web.Mvc;
using System.Web.Mvc.Resources;
using System.Web.Routing;
namespace MvcApplication1
{
public static class ValidateCodeHelper
{
private const string IdPrefix = "validateCode";
private const int Length = 4;
public static MvcHtmlString ValidateCode(this HtmlHelper helper)
{
return ValidateCode(helper, IdPrefix);
}
public static MvcHtmlString ValidateCode(this HtmlHelper helper,string id)
{
return ValidateCode(helper, id, Length);
}
public static MvcHtmlString ValidateCode(this HtmlHelper helper, string id, int length)
{
return ValidateCode(helper, id, length, null);
}
public static MvcHtmlString ValidateCode(this HtmlHelper helper, string id, object htmlAttributes)
{
return ValidateCode(helper, id, Length, htmlAttributes);
}
public static MvcHtmlString ValidateCode(this HtmlHelper helper, int length, object htmlAttributes)
{
return ValidateCode(helper, IdPrefix, length, htmlAttributes);
}
public static MvcHtmlString ValidateCode(this HtmlHelper helper, object htmlAttributes)
{
return ValidateCode(helper, 4, htmlAttributes);
}
public static MvcHtmlString ValidateCode(this HtmlHelper helper, int length)
{
return ValidateCode(helper,length, null);
}
public static MvcHtmlString ValidateCode(this HtmlHelper helper,string id,int length,object htmlAttributes)
{
string finalId = id + "_imgValidateCode";
var tagBuild = new TagBuilder("img");
tagBuild.GenerateId(finalId);
var defaultController = ((Route)RouteTable.Routes["Default"]).Defaults["controller"] + "/";
var controller = HttpContext.Current.Request.Url.Segments.Length == 1
? defaultController
: HttpContext.Current.Request.Url.Segments[1];
tagBuild.MergeAttribute("src", string.Format("/{0}GetValidateCode?length={1}",controller,length));
tagBuild.MergeAttribute("alt", "看不清?点我试试看!");
tagBuild.MergeAttribute("style","cursor:pointer;");
tagBuild.MergeAttributes(AnonymousObjectToHtmlAttributes(htmlAttributes));
var sb = new StringBuilder();
sb.Append("<script language=\"javascript\" type=\"text/javascript\">");
sb.Append("$(document).ready(function () {");
sb.AppendFormat("$(\"#{0}\").bind(\"click\", function () {{", finalId);
//sb.Append("$(this).attr(\"style\", \"cursor:pointer;\");");
sb.Append("var url = $(this).attr(\"src\");");
sb.Append("url += \"&\" + Math.random();");
sb.Append("$(this).attr(\"src\", url);");
sb.Append("});");
sb.Append("});");
sb.Append("</script>");
return MvcHtmlString.Create(tagBuild+sb.ToString());
}
public static RouteValueDictionary AnonymousObjectToHtmlAttributes(object htmlAttributes)
{
var result = new RouteValueDictionary();
if (htmlAttributes != null)
{
foreach (PropertyDescriptor property in TypeDescriptor.GetProperties(htmlAttributes))
{
result.Add(property.Name.Replace('_', '-'), property.GetValue(htmlAttributes));
}
}
return result;
}
}
}

2.生成验证码的代码:
代码如下:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Drawing;
using System.Drawing.Drawing2D;
using System.IO;
using System.Drawing.Imaging;
namespace MvcApplication1
{
public class ValidateCode
{
public ValidateCode()
{
}
/// <summary>
/// 验证码的最大长度
/// </summary>
public int MaxLength
{
get { return 10; }
}
/// <summary>
/// 验证码的最小长度
/// </summary>
public int MinLength
{
get { return 1; }
}
/// <summary>
/// 生成验证码
/// </summary>
/// <param name="length">指定验证码的长度</param>
/// <returns></returns>
public string CreateValidateCode(int length)
{
var randMembers = new int[length];
var validateNums = new int[length];
var validateNumberStr = "";
//生成起始序列值
var seekSeek = unchecked((int)DateTime.Now.Ticks);
var seekRand = new Random(seekSeek);
var beginSeek = (int)seekRand.Next(0, Int32.MaxValue - length * 10000);
var seeks = new int[length];
for (var i = 0; i < length; i++)
{
beginSeek += 10000;
seeks[i] = beginSeek;
}
//生成随机数字
for (var i = 0; i < length; i++)
{
var rand = new Random(seeks[i]);
var pownum = 1 * (int)Math.Pow(10, length);
randMembers[i] = rand.Next(pownum, Int32.MaxValue);
}
//抽取随机数字
for (var i = 0; i < length; i++)
{
var numStr = randMembers[i].ToString();
var numLength = numStr.Length;
var rand = new Random();
var numPosition = rand.Next(0, numLength - 1);
validateNums[i] = Int32.Parse(numStr.Substring(numPosition, 1));
}
//生成验证码
for (var i = 0; i < length; i++)
{
validateNumberStr += validateNums[i].ToString();
}
return validateNumberStr;
}
/// <summary>
/// 创建验证码的图片
/// </summary>
/// <param name="validateCode">验证码</param>
public byte[] CreateValidateGraphic(string validateCode)
{
var image = new Bitmap((int)Math.Ceiling(validateCode.Length * 12.0), 22);
var g = Graphics.FromImage(image);
try
{
//生成随机生成器
var random = new Random();
//清空图片背景色
g.Clear(Color.White);
//画图片的干扰线
for (int i = 0; i < 25; i++)
{
var x1 = random.Next(image.Width);
var x2 = random.Next(image.Width);
var y1 = random.Next(image.Height);
var y2 = random.Next(image.Height);
g.DrawLine(new Pen(Color.Silver), x1, y1, x2, y2);
}
//Font font = new Font("Arial", 12, (FontStyle.Bold | FontStyle.Italic));
string[] fontName = { "华文新魏", "宋体", "圆体", "黑体", "隶书" };
var font = new Font(fontName[new Random().Next(0, validateCode.Length)], 12, (FontStyle.Bold | FontStyle.Italic));
var brush = new LinearGradientBrush(new Rectangle(0, 0, image.Width, image.Height),
Color.Blue, Color.DarkRed, 1.2f, true);
g.DrawString(validateCode, font, brush, 3, 2);
//画图片的前景干扰点
for (var i = 0; i < 100; i++)
{
var x = random.Next(image.Width);
var y = random.Next(image.Height);
image.SetPixel(x, y, Color.FromArgb(random.Next()));
}
//画图片的边框线
g.DrawRectangle(new Pen(Color.Silver), 0, 0, image.Width - 1, image.Height - 1);
//保存图片数据
var stream = new MemoryStream();
image.Save(stream, ImageFormat.Jpeg);
//
输出图片流
return stream.ToArray();
}
finally
{
g.Dispose();
image.Dispose();
}
}
/// <summary>
/// 得到验证码图片的长度
/// </summary>
/// <param name="validateNumLength">验证码的长度</param>
/// <returns></returns>
public static int GetImageWidth(int validateNumLength)
{
return (int)(validateNumLength * 12.0);
}
/// <summary>
/// 得到验证码的高度
/// </summary>
/// <returns></returns>
public static double GetImageHeight()
{
return 23;
}
}
}

3.建一个BaseController
代码如下:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace MvcApplication1
{
public class BaseController:Controller
{
public ActionResult GetValidateCode(int length)
{
var vCode = new ValidateCode();
var code = vCode.CreateValidateCode(length);
Session["ValidateCode"] = code;
var bytes = vCode.CreateValidateGraphic(code);
return File(bytes, @"image/gif");
}
protected string GetValidateCode()
{
return Session["ValidateCode"].ToString();
}
}
}

4.让Controller继承BaseController:
代码如下:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Web.Security;
namespace MvcApplication1.Controllers
{
public class HomeController :BaseController
{
public ActionResult Index()
{
ViewBag.Message = "Welcome to ASP.NET MVC!";
return View();
}
public ActionResult About()
{
var code = GetValidateCode();
return View();
}
}
}

5.页面调用代码:
代码如下:

@using MvcApplication1
@{
ViewBag.Title = "About Us";
}
<h2>About</h2>
<p>
Put content here.
</p>
@Html.ValidateCode()

6.验证码的效果图:

源码可以从这里下载: ValidateCode.rar

下载本文
显示全文
专题