• 3、VS2010+ASP.NET MVC4+EF4+JqueryEasyUI+Oracle项目开发之——用户登录


    近期因为项目赶着上线,一直没时间接着写博客,今天最终空出了时间。声名:我不是专业美工,所以界面问题,希望大家不要拍砖。登录界面例如以下:

    在ASP.NET MVC中,要新增一个功能,我们首先要加入一个控制器,AccountController.cs,加入方法:右键单击Controllers目录,

            /// <summary>
            /// 登录页面
            /// </summary>
            /// <returns></returns>
            public ActionResult Index()
            {
                return View();
            }
            /// <summary>
            /// 点击 登录系统 后取消
            /// </summary>
            /// <param name="model">登录信息</param>
            /// <returns></returns>
            [HttpPost]
            public ActionResult Index(LogOnModel model)
            {
                #region 验证码验证
    
                if (Session["_VCode"] != null && model.ValidateCode!=null&& model.ValidateCode.ToLower() != Session["_VCode"].ToString())
                {
                    ModelState.AddModelError("PersonName", "验证码错误!"); //return "";
                    return View();
                }
                #endregion
    
                if (ModelState.IsValid) //这个是界面数据的模型验证 相应LogOnModel模型类中 诸如:[Required(ErrorMessage = "请填写username")] 必填 ...等验证
                {
                    SMUSERTB person = _accountService.ValidateUser(model.PersonName, xEncrypt.EncryptText(model.Password));
                    if (person != null) //登录成功
                    {
                        Account account = new Account();
                        account.USER_NAME = person.USER_NAME;
                        account.UID = person.U_ID;
                        account.USER_ID = person.USER_ID;
                        account.GuidCode = person.GUILD_CODE;
                        Session["account"] = account;
    
                        return RedirectToAction("Index", "Home");
                    }
                }
    
                ModelState.AddModelError("PersonName", "username或者password出错。");
                return View();
            }
       public void ValidateCode()
            {
                Response.ClearContent(); //须要输出图象信息 要改动HTTP头 
                Response.ContentType = "image/jpeg";
    
                ValidateCodeFun.CreateValidateCode(4);
            }
    
    当中LogOnModel是专门为登录进行设计的业务模型,

        public class LogOnModel
        {
            [Required(ErrorMessage = "请填写username")]
            [DisplayName("username")]
            public string PersonName { get; set; }
    
            [StringLength(100, ErrorMessage = "{0} 必须至少包括 {2} 个字符。", MinimumLength = 3)]
            [Required(ErrorMessage = "请填写password")]
            [DataType(DataType.Password)]
            [DisplayName("password")]
            public string Password { get; set; }
    
            [Required(ErrorMessage = "请填写验证码")]
            [DisplayName("验证码")]
            public string ValidateCode { get; set; }
    
            [DisplayName("记住我?")]
            public bool RememberMe { get; set; }
        }

    关于验证码类,我就不多说了,大家都懂,我这里直接贴代码,例如以下:

       public static class ValidateCodeFun
        {
            public static void CreateValidateCode(int codeNum)
            {
                string vnum= GetByRndNum(codeNum);
    
                Bitmap Img = null;
                Graphics g = null;
                Random random = new Random();
                int gheight = vnum.Length * 16;
                Img = new Bitmap(gheight, 26);
                g = Graphics.FromImage(Img);
                //Font f = new Font("微软雅黑", 16, FontStyle.Bold);
                Color[] c = { Color.SpringGreen, Color.Red, Color.LightBlue, Color.SeaGreen, Color.Orange, Color.Yellow, Color.RosyBrown };
    
                Font f = new Font("宋体", 16, FontStyle.Bold);
    
                g.Clear(Color.White);//设定背景色
                //Pen blackPen = new Pen(ColorTranslator.FromHtml("#e1e8f3"), 18);
                Pen blackPen = new Pen(c[random.Next(7)], 18);
    
                //绘图片的前景噪音点
                for (int i = 0; i < 80; i++)
                {
                    int x = random.Next(Img.Width);
                    int y = random.Next(Img.Height);
                    Img.SetPixel(x, y, Color.FromArgb(random.Next()));
                }
    
                for (int i = 0; i < 128; i++)// 随机产生干扰线,使图象中的认证码不易被其他程序探測到
                {
                    int x = random.Next(gheight);
                    int y = random.Next(20);
                    int xl = random.Next(6);
                    int yl = random.Next(2);
                    g.DrawLine(blackPen, x, y, x + xl, y + yl);
                }
    
                SolidBrush s = new SolidBrush(ColorTranslator.FromHtml("#411464"));
                g.DrawString(vnum, f, s, 1, 1);
    
                //画边框
                blackPen.Width = 1;
                g.DrawRectangle(blackPen, 0, 0, Img.Width - 1, Img.Height - 1);
                Img.Save(HttpContext.Current.Response.OutputStream, ImageFormat.Jpeg);
                s.Dispose();
                f.Dispose();
                blackPen.Dispose();
                g.Dispose();
                Img.Dispose();
    
                //Response.End();
            }
    
            //-----------------给定范围获得随机颜色
            static Color GetByRandColor(int fc, int bc)
            {
                Random random = new Random();
    
                if (fc > 255)
                    fc = 255;
                if (bc > 255)
                    bc = 255;
                int r = fc + random.Next(bc - fc);
                int g = fc + random.Next(bc - fc);
                int b = fc + random.Next(bc - bc);
                Color rs = Color.FromArgb(r, g, b);
                return rs;
            }
    
            //取随机产生的认证码(数字)
            public static string GetByRndNum(int VcodeNum)
            {
                string VNum = "";
                Random rand = new Random();
                for (int i = 0; i < VcodeNum; i++)
                {
                    VNum += VcArray[rand.Next(0, 61)];
                }
                HttpContext.Current.Session["_VCode"] = VNum.ToLower();
                return VNum;
            }
            private static readonly string[] VcArray =
                new string[] {"0","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","x","y","z","A","B","C","D","E","F","G",
                    "H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z" };
        }

    最后,看下视图View,新建View方法例如以下:

    View十分简单,这里我就不多说,自己看代码,例如以下:

    @model YKT.Model.LogOnModel
    @{
        Layout = null;
    }
    <!DOCTYPE html>
    <html>
    <head id="Head1">
        <title>企业平台登录</title>
        <link href="@Url.Content("~/Content/Login.css")" rel="stylesheet" type="text/css" />
        <script type="text/javascript">
            function RefreshValidateCode(obj) {
                obj.src = "/Account/ValidateCode/" + Math.floor(Math.random() * 10000);
            }
        </script>
    </head>
    <body>
        @using (Html.BeginForm((string)ViewBag.FormAction, "Account"))
        {
             <div class="login">
            <div class="top">
            </div>
            <div class="middle">
                <div class="left">
                    <img alt="登录" src="images/login_pic.gif"></div>
                <div class="right">
                    <div class="right2">
                        <fieldset style="border-top: 0px; border-left: #e8e8e8 1px solid; border-right: #e8e8e8 1px solid;
                            border-bottom: #e8e8e8 1px solid;">
                            <div class="editor-label">
                                username:
                            </div>
                            <div class="personname">
                                @Html.TextBoxFor(m => m.PersonName)
                            </div>
                            <div class="editor-label">
                                密   码:
                            </div>
                            <div class="password">
                                @Html.PasswordFor(m => m.Password)
                            </div>
                            <div class="editor-label" >
                                验证码:
                            </div>
                            <div class="validatecode">
                                @Html.TextBoxFor(m => m.ValidateCode, new { MaxLength = "4",@class="easyui-validatebox",required="true",
    missingMessage="不能为空"})
                                <img alt="点击刷新验证码!" title="点击刷新验证码!" src="Account/ValidateCode" style="cursor: pointer;"
                                    onclick="RefreshValidateCode(this);" />
                            </div>
                            <p>
                                <input class="submitcss" type="submit" value="登录系统" /> 
                                <span style="display:none">
                                @Html.CheckBoxFor(m=>m.RememberMe,"记住我")
                                @Html.LabelFor(m=>m.RememberMe)
                                </span>
                            </p>
                            <p>
                                @Html.ValidationMessageFor(m => m.PersonName)<br />
                                @Html.ValidationMessageFor(m => m.Password)
                            </p>
                        </fieldset>
                    </div>
                </div>
            </div>
            <div class="bottom">
            </div>
        </div>
        }
    </body>
    </html>
    


  • 相关阅读:
    node基础和express服务器框架知识点总结
    Nacos配置服务原理
    Queue-PriorityQueue源码解析
    Mysql存储结构
    Mybatis处理动态占位符实现
    通过ThreadPoolExecutor源码分析线程池实现原理
    jdk8函数接口
    Logback源码分析
    Spring注解Component原理源码解析
    ApplicationListener原理分析
  • 原文地址:https://www.cnblogs.com/mengfanrong/p/3770066.html
Copyright © 2020-2023  润新知