一個圖片驗證碼的HtmlHelper

本文轉載自查看原文 2012-04-28 14:16 5226 mvc驗證碼/ asp.net mvc3/ Asp.net MVC/ ASP.NET/ MVC3 驗證碼

一個圖片驗證碼的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.驗證碼的效果圖：

源碼可以從這里下載：

http://files.cnblogs.com/JackFeng/ValidateCode.rar

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 用python做一個圖片驗證碼一個圖片驗證碼的實現自己寫一個圖片驗證碼程序自己封裝的一個java圖片驗證碼驗證碼圖片圖片驗證碼圖片驗證碼 MVC偽一個12306圖片驗證碼圖片驗證碼生成並驗證驗證碼 Java圖片驗證碼