一、基本登陆实现与验证码功能实现，该功能是和spring.net功能集合使用的，因为后面要用到验证是否处于登陆状态
1. 先构建一个登陆页面
?1 @{ ?2 ????Layout = null; ?3 } ?4 <!DOCTYPE html> ?5 <html> ?6 <head> ?7 ????<title>XX商城后台管理系统登录</title> ?8 ????<script type="text/javascript"> ?9 ????????if (window.parent.window != window) { 10 ????????????window.top.location.href = "/Home/CheckLogin"; 11 ????????} 12 ????</script> 13 ????<script src="~/Scripts/jquery-1.8.2.min.js" type="text/javascript"></script> 14 ????@* <script src="../../Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>*@ 15 ????<script src="~/Scripts/jquery.validate.min.js"></script> 16 ????@*<script src="../../Scripts/jquery.validate.min.js" type="text/javascript"></script>*@ 17 ????????<script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script> ??@*ajax登录*@ 18 ????????<script type="text/javascript"> 19 ????????????function changeCheckCode() { 20 ????????????????//为图片加一个src参数，向其后追加一个1，比如现在是src=“a1”,点击一次就是a11 21 ????????????????$("#img").attr("src", $("#img").attr("src") + 1); 22 ????????????} 23 ????????????function afterLogin(data) { 24 ????????????????var serverData = data.split(‘:‘); 25 ????????????????if (serverData[0] == "ok") { 26 ????????????????????//页面跳转一下 27 ????????????????????window.location.href = "/Home/Index" 28 ????????????????} else { 29 ????????????????????$("#errorMsg").css("display", "block"); 30 ????????????????????$("#errorMsg").text(serverData[1]); 31 ????????????????????changeCheckCode(); ??//让验证码切换一下 32 ????????????????} 33 ????????????} 34 ????????</script> 35 ????????<style type="text/css"> 36 ????????????* { 37 ????????????????padding: 0; 38 ????????????????margin: 0; 39 ????????????} 40 ????????????body { 41 ????????????????text-align: center;background: #4974A4; 42 ????????????} 43 ????????????#login { 44 ????????????????width: 740px; margin: 0 auto;font-size: 12px; 45 ????????????} 46 ????????????#loginlogo { 47 ????????????????width: 700px; height: 100px; overflow: hidden;background: url(‘/Content/Images/login/logo.png‘) no-repeat; 48 ????????????} 49 ????????????#loginpanel { 50 ????????????????width: 729px; 51 ????????????????position: relative; 52 ????????????????height: 300px; 53 ????????????} 54 ????????????.panel-h { 55 ????????????????width: 729px; 56 ????????????????height: 20px; 57 ????????????????background: url(‘/Content/Images/login/panel-h.gif‘) no-repeat; 58 ????????????????position: absolute; 59 ????????????????top: 0px; 60 ????????????????left: 0px; 61 ????????????????z-index: 3; 62 ????????????} 63 ????????????.panel-f { 64 ????????????????width: 729px; 65 ????????????????height: 13px; 66 ????????????????background: url(‘/Content/Images/login/panel-f.gif‘) no-repeat; 67 ????????????????position: absolute; 68 ????????????????bottom: 0px; 69 ????????????????left: 0px; 70 ????????????????z-index: 3; 71 ????????????} 72 ????????????.panel-c { 73 ????????????????z-index: 2; 74 ????????????????background: url(‘/Content/Images/login/panel-c.gif‘) repeat-y; 75 ????????????????width: 729px; 76 ????????????????height: 300px; 77 ????????????} 78 ????????????.panel-c-l { 79 ????????????????position: absolute; 80 ????????????????left: 60px; 81 ????????????????top: 40px; 82 ????????????} 83 ????????????.panel-c-r { 84 ????????????????position: absolute; 85 ????????????????right: 20px; 86 ????????????????top: 50px; 87 ????????????????width: 222px; 88 ????????????????line-height: 200%; 89 ????????????????text-align: left; 90 ????????????} 91 ????????????.panel-c-l h3 { 92 ????????????????color: #556A85; 93 ???????????????? 94 ????????????} 95 ????????????.panel-c-l td { 96 ????????????????padding: 7px; 97 ????????????} 98 ????????????.login-text { 99 ????????????????height: 24px;100 ????????????????left: 24px;101 ????????????????border: 1px solid #e9e9e9;102 ????????????????background: #f9f9f9;103 ????????????}104 ????????????.login-text-focus {105 ????????????????border: 1px solid #E6BF73;106 ????????????}107 ????????????.login-btn {108 ????????????????width: 114px;109 ????????????????height: 29px;110 ????????????????color: #E9FFFF;111 ????????????????line-height: 29px;112 ????????????????background: url(‘/Content/Images/login/login-btn.gif‘) no-repeat;113 ????????????????border: none;114 ????????????????overflow: hidden;115 ????????????????cursor: pointer;116 ????????????}117 ????????????#txtUsername, #code, #txtPassword {118 ????????????????width: 191px;119 ????????????}120 ????????????#logincopyright {121 ????????????????text-align: center;122 ????????????????color: White;123 ????????????????124 ????????????}125 ????????????a {126 ????????????????color: Black;127 ????????????}128 ????????????????a:hover {129 ????????????????????color: Red;130 ????????????????????text-decoration: underline;131 ????????????????}132 ????????</style>133 ????</head>134 ????<body style="padding: 10px">135 ????????<div >136 ????????????<div >137 ????????????</div>138 ????????????<div >139 ????????????????<div >140 ????????????????</div>141 ????????????????<div >142 ????????????????????<div > ????????@*请求地址，控制器名 ???参数为null ???????????????????????????请求方式 ???????????返回函数 ??????????加载执行时动画 ?????????????????????表单id的值 ?*@ ??????143 ????????????????????????@using (Ajax.BeginForm("UserLogin", "Login", new { }, new AjaxOptions() { HttpMethod = "post", OnSuccess = "afterLogin", LoadingElementId = "div1" }, new { id = "loginForm" }))144 ????????????????????????{145 ????????????????????????????<table cellpadding="0" cellspacing="0">146 ????????????????????????????????<tbody>147 ????????????????????????????????????<tr>148 ????????????????????????????????????????<td colspan="2">149 ????????????????????????????????????????????<h3>150 ????????????????????????????????????????????????请使用ItcastOA管理系统账号登录151 ????????????????????????????????????????????</h3>152 ????????????????????????????????????????</td>153 ????????????????????????????????????</tr>154 ????????????????????????????????????<tr>155 ????????????????????????????????????????<td align="right">156 ????????????????????????????????????????????账号：157 ????????????????????????????????????????</td>158 ????????????????????????????????????????<td >159 ????????????????????????????????????????????<input type="text" name="LoginCode" />160 ????????????????????????????????????????</td>161 ????????????????????????????????????</tr>162 ????????????????????????????????????<tr>163 ????????????????????????????????????????<td align="right">164 ????????????????????????????????????????????密码：165 ????????????????????????????????????????</td>166 ????????????????????????????????????????<td >167 ????????????????????????????????????????????<input type="password" name="LoginPwd" value="123" />168 ????????????????????????????????????????</td>169 ????????????????????????????????????</tr>170 ????????????????????????????????????<tr>171 ????????????????????????????????????????<td>172 ????????????????????????????????????????????验证码：173 ????????????????????????????????????????</td>174 ????????????????????????????????????????<td >175 ????????????????????????????????????????????<input type="text" name="vCode" value="1" />176 ????????????????????????????????????????</td>177 ????????????????????????????????????</tr>178 ????????????????????????????????????<tr>179 ????????????????????????????????????????<td></td>180 ????????????????????????????????????????<td>181 ????????????????????????????????????????????<img src="/Login/ShowValidateCode?id=1" style="float: left; height: 24px;" />182 ????????????????????????????????????????????<div style="float: left; margin-left: 5px; ">183 ????????????????????????????????????????????????<a href="javascript:void(0)" >看不清，换一张</a>184 ????????????????????????????????????????????</div>185 ????????????????????????????????????????</td>186 ????????????????????????????????????</tr>187 ????????????????????????????????????<tr>188 ????????????????????????????????????????<td align="center" colspan="2">189 ????????????????????????????????????????????<input type="submit" value="登录" /><span style="font-size:14px;color:red;display:none"></span>190 ????????????????????????????????????????????<div style="display:none">正在登录，请稍后....</div>191 ????????????????????????????????????????</td>192 ????????????????????????????????????</tr>193 ????????????????????????????????</tbody>194 ????????????????????????????</table>195 ????????????????????????}196 ????????????????????</div>197 ????????????????????<div >198 ????????????????????????<p>199 ????????????????????????????请从左侧输入登录账号和密码登录200 ????????????????????????</p>201 ????????????????????????<p>202 ????????????????????????????如果遇到系统问题，请联系网络管理员。203 ????????????????????????</p>204 ????????????????????????<p>205 ????????????????????????????如果没有账号，请联系网站管理员。206 ????????????????????????</p>207 ????????????????????????<p>208 ????????????????????????????......209 ????????????????????????</p>210 ????????????????????</div>211 ????????????????</div>212 ????????????????<div >213 ????????????????</div>214 ????????????</div>215 ????????????<div >216 ????????????????Copyright ? 2015 itcast.com217 ????????????</div>218 ????????</div>219 ????</body>220 </html>2、 封装一个生成验证码的文件，放置在Common文件夹下，引用dll文件system.Drawing。
using System;using System.Collections.Generic;using System.Drawing;using System.Drawing.Drawing2D;using System.Drawing.Imaging;using System.IO;using System.Linq;using System.Text;using System.Threading.Tasks;using System.Web;namespace Common{ ??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) ???????{ ???????????int[] randMembers = new int[length]; ???????????int[] validateNums = new int[length]; ???????????string validateNumberStr = ""; ???????????//生成起始序列值 ???????????int seekSeek = unchecked((int)DateTime.Now.Ticks); ???????????Random seekRand = new Random(seekSeek); ???????????int beginSeek = (int)seekRand.Next(0, Int32.MaxValue - length * 10000); ???????????int[] seeks = new int[length]; ???????????for (int i = 0; i < length; i++) ???????????{ ???????????????beginSeek += 10000; ???????????????seeks[i] = beginSeek; ???????????} ???????????//生成随机数字 ???????????for (int i = 0; i < length; i++) ???????????{ ???????????????Random rand = new Random(seeks[i]); ???????????????int pownum = 1 * (int)Math.Pow(10, length); ???????????????randMembers[i] = rand.Next(pownum, Int32.MaxValue); ???????????} ???????????//抽取随机数字 ???????????for (int i = 0; i < length; i++) ???????????{ ???????????????string numStr = randMembers[i].ToString(); ???????????????int numLength = numStr.Length; ???????????????Random rand = new Random(); ???????????????int numPosition = rand.Next(0, numLength - 1); ???????????????validateNums[i] = Int32.Parse(numStr.Substring(numPosition, 1)); ???????????} ???????????//生成验证码 ???????????for (int i = 0; i < length; i++) ???????????{ ???????????????validateNumberStr += validateNums[i].ToString(); ???????????} ???????????return validateNumberStr; ???????} ???????/// <summary> ???????/// 创建验证码的图片 ???????/// </summary> ???????/// <param name="context">要输出到的page对象</param> ???????/// <param name="validateNum">验证码</param> ???????public void CreateValidateGraphic(string validateCode, HttpContext context) ?????//使用HttpContext必须引用system.web，是引入而不是导入 ???????{ ???????????Bitmap image = new Bitmap((int)Math.Ceiling(validateCode.Length * 12.0), 22); ???????????Graphics g = Graphics.FromImage(image); ???????????try ???????????{ ???????????????//生成随机生成器 ???????????????Random random = new Random(); ???????????????//清空图片背景色 ???????????????g.Clear(Color.White); ???????????????//画图片的干扰线 ???????????????for (int i = 0; i < 25; i++) ???????????????{ ???????????????????int x1 = random.Next(image.Width); ???????????????????int x2 = random.Next(image.Width); ???????????????????int y1 = random.Next(image.Height); ???????????????????int 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)); ???????????????LinearGradientBrush 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 (int i = 0; i < 100; i++) ???????????????{ ???????????????????int x = random.Next(image.Width); ???????????????????int 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); ???????????????//保存图片数据 ???????????????MemoryStream stream = new MemoryStream(); ???????????????image.Save(stream, ImageFormat.Jpeg); ???????????????//输出图片流 ???????????????context.Response.Clear(); ???????????????context.Response.ContentType = "image/jpeg"; ???????????????context.Response.BinaryWrite(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 22.5; ???????} ???????//C# MVC 升级版 ???????/// <summary> ???????/// 创建验证码的图片 ???????/// </summary> ???????/// <param name="containsPage">要输出到的page对象</param> ???????/// <param name="validateNum">验证码</param> ???????public byte[] CreateValidateGraphic(string validateCode) ???????{ ???????????Bitmap image = new Bitmap((int)Math.Ceiling(validateCode.Length * 12.0), 22); ???????????Graphics g = Graphics.FromImage(image); ???????????try ???????????{ ???????????????//生成随机生成器 ???????????????Random random = new Random(); ???????????????//清空图片背景色 ???????????????g.Clear(Color.White); ???????????????//画图片的干扰线 ???????????????for (int i = 0; i < 25; i++) ???????????????{ ???????????????????int x1 = random.Next(image.Width); ???????????????????int x2 = random.Next(image.Width); ???????????????????int y1 = random.Next(image.Height); ???????????????????int 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)); ???????????????LinearGradientBrush 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 (int i = 0; i < 100; i++) ???????????????{ ???????????????????int x = random.Next(image.Width); ???????????????????int 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); ???????????????//保存图片数据 ???????????????MemoryStream stream = new MemoryStream(); ???????????????image.Save(stream, ImageFormat.Jpeg); ???????????????//输出图片流 ???????????????return stream.ToArray(); ???????????} ???????????finally ???????????{ ???????????????g.Dispose(); ???????????????image.Dispose(); ???????????} ???????} ???}}3. 后端代码实现完成用户登录与验证码功能实现。
1 using BLL; 2 using System; 3 using System.Collections.Generic; 4 using System.Linq; 5 using System.Web; 6 using System.Web.Mvc; 7 namespace OA_MVC.Controllers 8 { 9 ????public class LoginController : Controller10 ????{11 ????????//12 ????????// GET: /Login/13 14 ????????public ActionResult Index()15 ????????{16 ????????????return View();17 ????????}18 ????????IBLL.IUserInfoService UserInfoService { get; set; }19 ????????#region 完成用户登录20 ????????public ActionResult UserLogin()21 ????????{22 ????????????//判断验证码是否正确23 ????????????string validateCode = Session["validateCode"] != null ? Session["validateCode"].ToString() : string.Empty;24 ????????????if (string.IsNullOrEmpty(validateCode)) ?//如果等于null25 ????????????{26 ????????????????return Content("no:验证码错误!!");27 ????????????}28 ????????????Session["validateCode"] = null;29 ????????????string txtCode = Request["vCode"];30 ????????????//如果验证码不相等31 ????????????if (!validateCode.Equals(txtCode, StringComparison.InvariantCultureIgnoreCase))32 ????????????{33 ????????????????return Content("no:验证码错误!!");34 ????????????}35 ????????????string userName = Request["LoginCode"];36 ????????????string userPwd = Request["LoginPwd"];37 ????????????var userInfo = UserInfoService.LoadEntities(u => u.UName == userName && u.UPwd == userPwd).FirstOrDefault();//根据用户名找用户38 ????????????if (userInfo != null)39 ????????????{40 ?????????????????Session["userInfo"] = userInfo;41 ????????????????////产生一个GUID值作为Memache的键.42 ????????????????//// ?System.Web.Script.Serialization.JavaScriptSerializer43 ????????????????//string sessionId = Guid.NewGuid().ToString();44 ????????????????//Common.MemcacheHelper.Set(sessionId, Common.SerializeHelper.SerializeToString(userInfo)45 ????????????????// ???, DateTime.Now.AddMinutes(20));//将登录用户信息存储到Memcache中。46 ????????????????//Response.Cookies["sessionId"].Value = sessionId;//将Memcache的key以Cookie的形式返回给浏览器。47 ????????????????return Content("ok:登录成功");48 ????????????}49 ????????????else50 ????????????{51 ????????????????return Content("no:登录失败");52 ????????????}53 ????????}54 ????????#endregion55 ????????#region 显示验证码56 ????????public ActionResult ShowValidateCode()57 ????????{58 ????????????Common.ValidateCode vliateCode = new Common.ValidateCode();59 ????????????string code = vliateCode.CreateValidateCode(4);//产生验证码，4位数的验证码60 ????????????Session["validateCode"] = code; ??//存在session中进行校验61 ????????????byte[] buffer = vliateCode.CreateValidateGraphic(code);//将验证码画到画布上.62 ????????????return File(buffer, "image/jpeg"); ???//向浏览器返回一个文件 63 ????????}64 ????????#endregion65 ????}66 }4. config文件夹中的controllers.xml文件中，加入以下代码，作用是为该类中的UserInfoService属性赋值。 相关spring.net知识点请参考https://www.cnblogs.com/wangjinya/p/10706744.html
1 <object ?type="CZBK.ItcastOA.WebApp.Controllers.LoginController, CZBK.ItcastOA.WebApp" singleton="false" >2 ????<property name="UserInfoService" ref="UserInfoService" />3 ??</object>
5. 方法过滤器，
5.1 新建一个base控制器，该控制器主要用来把执行过程从中间切割，让每一次执行，都会执行该方法，OnActionExecuting方法是提供的一个类，每次执行就会先执行该方法。
1 ????public class BaseController : Controller 2 ????{ 3 ????????// 4 ????????// GET: /Base/ 5 ?6 ??????????/// <summary> 7 ??????????/// 方法过滤器，执行控制器中的方法之前先执行该方法。 8 ??????????/// </summary> 9 ??????????/// <param name="filterContext"></param>10 ??????????protected override void OnActionExecuting(ActionExecutingContext filterContext)11 ?????????{12 ?????????????base.OnActionExecuting(filterContext);13 ?????????????if (Session["userInfo"] == null)14 ????????????{15 ?????????????????// ?filterContext.HttpContext.Response.Redirect("/Login/Index");16 ?????????????????//返回一个ActionResult类型的Redirect，继承该类的类就不会去执行本身的Redirect，需要使用下面的方法，而不是上面的方法17 ?????????????????filterContext.Result = Redirect("/Login/Index");18 ?????????????}19 ?????????}20 ????}21 }5.2 让每一个控制器继承该控制器的类名
1 ??public class LoginController : BaseController //Controller 2 ????{ 3 ????????// 4 ????????// GET: /Login/ 5 ?6 ????????public ActionResult Index() 7 ????????{ 8 ????????????return View(); 9 ????????}10 }MVC基本登陆与验证码功能实现
原文地址：https://www.cnblogs.com/wangjinya/p/10790410.html