登录页面讲解

在很多网站和软件都会用到登录，所有今天就来讲一下登录。

生成验证码

在控制器中定义一个方法

首先声明一个字符串，可以直接赋值为固定的字符串，也可以生成一个随机字符串

例如：string strRandom = "abc";

string strRandom = ValidCodeUtils.GetRandomCode(3); 随机生成一个3位数的字符串

注：ValidCodeUtils.GetRandomCode和CreateImage自己定义的方法

方法详情已经在上一篇详细讲解了

然后将验证码存入session会话

Session["validCode"] = strRandom;

再根据验证码产生图片

byte[] imgByte = ValidCodeUtils.CreateImage(strRandom);

最后返回图片信息

return File(imgByte, @"image/jpeg");

在页面中验证码图片的路径为控制器中生成验证码的方法

代码：

<div class="input-group-prepend">@*验证码图片*@

<img src="/Main/ValidCode" class="input-group-text p-0" id="ValidateCode" />

</div>

在验证图片有一些不是很清楚的时候，可以点击切换验证码图片。

详细操作如下

给验证图片一个点击事件

代码：  $("#ValidateCode").click(function () {

            $(this).prop("src", "/Main/ValidCode?v=" + new Date().getTime());

        });

登录验证

获取页面传递的数据

代码如下：

string strUserNuber = Request["UserNuber"].Trim();//用户名

string strPassword = Request["password"].Trim();//密码

string strValidCode = Request["validCode"].Trim();//验证码

string strUserTypeClass = Request["UserTypeClass"].Trim();//用户类型

string strRememberMe = Request["rememberMe"].Trim();//记住否

获取存放在session中的验证码

string sessionValiCode = "";

            try

            {

                sessionValiCode = Session["validCode"].ToString();

            }

            catch (Exception)

            {

                msg.Text = "验证码丢失！请刷新验证码，重新登录验证";

                return Json(msg, JsonRequestBehavior.AllowGet);

            }

判断填入的验证码和session中的验证码是否一致

代码：if (sessionValiCode.Equals(strValidCode.Trim(), StringComparison.InvariantCultureIgnoreCase)) {}

注：InvariantCultureIgnoreCase 忽略大小写

           

将用户输入的密码进行AES265后与数据库中的密码对比

查询出用户类型，判断用户身份

用户身份验证完成 开始处理登录信息

代码：

Session["UserID"] = dbUser.UserID;//传递UserID

Session["UserTypeID"] = listUserType[0].ActorID;//传递ActorID

  Session["ServerTime"] = DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss"); ;//登录时间

  Session["UserTypeClass"] = strUserTypeClass;//用户的类型 与页面对应

如果需要记住密码 strIsRember =="true "设置cookie

记住密码 保存cookie

例：HttpCookie cookie = new HttpCookie("user");

设置保存的天数

例：cookie.Expires = DateTime.Now.AddDays(7);保存7天

cookie["UserNuber"] = HttpUtility.UrlEncode(strUserNuber, Encoding.GetEncoding("UTF-8"));//用户名

注释：HttpUtility 提供在处理 Web 请求时用于编码和解码 URL 的方法

UrlEncode()使用指定的编码对象，对 URL 字符串进行编码

       cookie["Password"] = strPassword;//密码

       cookie["UserTypeClass"] = strUserTypeClass;//用户类型

       Response.Cookies.Add(cookie);

不用记住密码就删除cookie

代码如下：

HttpCookie cookie = new HttpCookie("user");

cookie.Expires = DateTime.Now.AddDays(-1);通过设置cookie的过期时间为负，强制使cookie过期

 Response.Cookies.Add(cookie);

读取cookie中的数据 登录页面数据回填

声明一些变量赋予初始值

读取浏览器请求传递的cookie

HttpCookie cookie = System.Web.HttpContext.Current.Request.Cookies["user"];

判断cookie是否存在

当cookie中有数据是说明是已经勾选，所以回填时也把√打上

将数据返回到页面中（去登录页面对于输入框中进行回填）

在登录页面

给登录按钮一个点击事件

获取登录要填写信息的值

代码：var UserTypeClass = $("#UserTypeClass").val();

            var UserNuber = $("#UserName").val();

            var password = $("#PassWord").val();

            var validCode = $("#IdentifyingCode").val();

//获取是否勾选 true  false

            var rememberMe = $('#RememberMe').is(":checked");//is用于筛选

判断是否填写数据，数据填写完整就提交数据

$.post（URL，{数据}，function（msg）{

注：URL提交表单时向何处发送表单数据

if (msg.State) {登录成功就跳转到主页面

  window.location.replace("/Main/Index");//使用replace不会出现后退按钮

} else {否则就清空之前填写的密码和验证码，刷新验证码

                        layer.alert(msg.Text)

                        //清空密码和验证码

                        $("#password").val("");

                        $("#ValidateCode").val("");

                        //验证码刷新

                        $("#ValidateCode").click();

                    }

}）