构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统（16）-权限管理系统-漂亮的验证码

原文:构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统（16）-权限管理系统-漂亮的验证码

 

我们上一节建了数据库的表,但我发现很多东西还未完善起来,比如验证码,我们先做好验证码吧,验证码我们再熟悉不过了，为了防止恶意的登录，我们必须在登录页面加入验证码,下面我将分享一个验证码，这个是用C#画的，原理是，生成一个随机4位数，将其保存为session或者是cookie形式，将用户输入的验证码进行对比，

验证码可以是一个视图cshtml，或者是一个aspx页面，也可以是一个ashx一般处理程序，我们这里用ashx来显示

在App.Admin下的Core文件夹下新建一个一般处理文件verify_code.ashx,复制以下代码（此验证码适用aspx程序的）

using System;

using System.IO;

using System.Drawing;

using System.Drawing.Imaging;

using System.Web;

using System.Web.SessionState;



namespace App.Admin

{

    /// <summary>

    /// 验证码生成类

    /// </summary>

    public class verify_code : IHttpHandler, IRequiresSessionState

    {



        public void ProcessRequest(HttpContext context)

        {

            int codeW = 80;

            int codeH = 22;

            int fontSize = 16;

            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", "Verdana", "Arial", "Gungsuh", "Impact" };

            //验证码的字符集，去掉了一些容易混淆的字符 

            char[] character = { '2', '3', '4', '5', '6', '8', '9', '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 = 0; i < 4; i++)

            {

                chkCode += character[rnd.Next(character.Length)];

            }

            //写入Session

            context.Session["Code"] = chkCode;

            //创建画布

            Bitmap bmp = new Bitmap(codeW, codeH);

            Graphics g = Graphics.FromImage(bmp);

            g.Clear(Color.White);

            //画噪线 

            for (int i = 0; i < 1; 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 = 0; 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 * 18 + 2, (float)0);

            }

            //画噪点 

            for (int i = 0; i < 100; i++)

            {

                int x = rnd.Next(bmp.Width);

                int y = rnd.Next(bmp.Height);

                Color clr = color[rnd.Next(color.Length)];

                bmp.SetPixel(x, y, clr);

            }

            //清除该页输出缓存，设置该页无缓存 

            context.Response.Buffer = true;

            context.Response.ExpiresAbsolute = System.DateTime.Now.AddMilliseconds(0);

            context.Response.Expires = 0;

            context.Response.CacheControl = "no-cache";

            context.Response.AppendHeader("Pragma", "No-Cache");

            //将验证码图片写入内存流，并将其以 "image/Png" 格式输出 

            MemoryStream ms = new MemoryStream();

            try

            {

                bmp.Save(ms, ImageFormat.Png);

                context.Response.ClearContent();

                context.Response.ContentType = "image/Png";

                context.Response.BinaryWrite(ms.ToArray());

            }

            finally

            {

                //显式释放资源 

                bmp.Dispose();

                g.Dispose();

            }

        }



        public bool IsReusable

        {

            get

            {

                return false;

            }

        }

    }

}

注意

 //写入Session
context.Session["Code"] = chkCode;
调用这个页面将生成一个session，我们将与用户输入的代码进行对比，OK回到Account的index视图

在验证码的位置嵌入这个页面

<tr>

                            <td style="width: 80px; text-align: right">验证码：

                            </td>

                            <td>

                                 <input style="width: 50px" type="text" name="ValidateCode" id="ValidateCode" />

                                <img id="codeImg" alt="刷新验证码！" style="margin-bottom: -8px; cursor: pointer;" src="/Core/verify_code.ashx" onclick="this.src=this.src+'?'" />

                                <a href="javascript:$('#codeImg').trigger('click')">看不清？</a>

                            </td>

                        </tr>

编译后预览一下