登录操作中的记住密码操作的算法逻辑

登录操作中的记住密码操作的算法逻辑

一、登录界面如何实现记住用户名和密码 且实现自动登录

最近在一次练习中遇到了一个问题，如何在登录界面实现记住用户名和密码，并且可以进行勾选是否自动登录。

首先，给大家看下我的登陆界面。

 

很显然，我布置了checkbox，一个用于记住密码，一个用于自动登录。

 

<label>
<input type="checkbox" name="autoLogin" id = "autoLogin"> 自动登录
</label>

 

<label>
<input type="checkbox" name="rememberMe" id = "rememberMe"> 记住密码
</label>

 

接下来就是如何对这两个按钮进行触发操作了，我主要是利用了jquery.cookie.js来进行的操作。这个需要自己去下载，然后引进。

 

 

//记住用户名密码
        function Save() {
            if ($("#rememberMe").prop("checked")) {
                var str_username = $("#NameText").val();//用户名
                var str_password = $("#inputPassword").val();//密码
                $.cookie("rmbUser", "true", { expires: 7 }); //存储一个带7天期限的cookie
                $.cookie("username", str_username, { expires: 7 });
                $.cookie("password", str_password, { expires: 7 });
            }
            else {
                $.cookie("rmbUser", "false", { expire: -1 });
                $.cookie("username", "", { expires: -1 });
                $.cookie("password", "", { expires: -1 });
            }

            if ($("#autoLogin").prop("checked")) {
                var str_username = $("#NameText").val();
                var str_password = $("#inputPassword").val();
                $.cookie("auto", "true", { expires: 7 }); //存储一个带7天期限的cookie
                $.cookie("username", str_username, { expires: 7 });
                $.cookie("password", str_password, { expires: 7 });
            }
            else {
                $.cookie("auto", "false", { expire: -1 });
                $.cookie("username", "", { expires: -1 });
                $.cookie("password", "", { expires: -1 });
            }
        };

通过上面代码的操作就可以进行判断，是否勾选了记住密码和自动登录的按钮，然后便将这个记录到cookie中，cookie的寿命为7天，关于如何触发这个save：在button上设置一个onclick，调用save函数，便可以在实现登陆的时候触发。

 

这样便把用户的相关信息存入了浏览器中，接下来就是如何在下一次点开登陆界面的时候自动填充数据。

$(document).ready(function () {

$("#autoLogin").change(function() {
    if($("#autoLogin").prop("checked")){
        $.cookie("auto", "true", { expires: 7 });
    }else{
        $.cookie("auto", "false", { expires: 7 });
    }
});

if ($.cookie("rmbUser") == "true") {
    $("#rememberMe").attr("checked", true);
    $("#NameText").val($.cookie("username"));
    $("#inputPassword").val($.cookie("password"));
}

if ($.cookie("auto") == "true") {
    setTimeout(function(){
        if($.cookie("auto") == "true")
        window.location.href='下一个界面';
    },5000);
}

 

首先在页面加载的一开始我便进行了判断，如果cookie中记录了记住我和自动登录，那么便自动填充数据，我在下面嗨加入了一些判断，如果是自动登录，用户会等待五秒钟，若是在等待过程中用户取消了勾选自动登录，那么监听器便接收到，从而改变状态，不会进入下一个界面。

 

这只是写的一个简单的记住密码和自动登陆，与后台数据库进行交互，进而判断的部分没有进行展示。

 

 

 

 

二、使用Cookie记住用户名和密码并自动登陆

很多时候我们在登陆一个网站的时候，输入用户名和密码下面都有一个记住我的功能选项，在不知道怎做的情况下，感觉非常头疼，其实很容易的，接下来就给大家介绍一下怎么实现此功能。

1、思路、用到的知识点。

　  1.1、首先分析用到的知识点有哪些？

　　　　用到的知识点是Cookie，Cookie是客户端的一种保存机制。Cookie的取值方式是通过键取值，你也可以通过Expires属性为其指定过期时间。

　  1.2、其次什么时候创建Cookie呢？

　　　　那就是在你校验好用户名和密码都正确以后就创建Cookie，为其键名赋值。

2、下面有两个方法，分别是UserLogin和SetCookie，UserLogin方法是用于校验用户输入的用户名和密码、当用户名和密码都正确的情况下，就调用SetCookie方法创建Cookie。

 1 /// <summary>
 2 /// 用户登录。
 3 /// </summary>
 4 /// <param name="_userName">用户名。</param>
 5 /// <param name="_password">密码。</param>
 6 private void UserLogin(string _userName, string _password)
 7 {       
 8     //在这里是通过用户名得到一个对象。    
 9     Model.UserInfo userInfo = userInfoBll.GetUserInfo(_userName);
10     if (userInfo != null)
11     {
12         if (userInfo.UserPassword.Equals(_password))
13         {
14             //如果用户名和密码都正确了，就调用SetCookie方法为其创建Cookie。
15             //在这里密码我没有加密，你可别忘了加密啊。
16             SetCookie(userInfo);
17             //为Session赋值。
18             Session["UserInfo"] = userInfo;
19             //页面跳转。            
20             Response.Redirect("/Member/Default.aspx");
21         }
22         else
23         {
24             ShowMsgInfo = "用户名或密码错误";
25             return;
26         }
27     }
28     else
29     {
30         ShowMsgInfo = "用户名不存在";
31         return;
32     }
33 }
34 
35 /// <summary>
36 /// 设置Cookie。
37 /// </summary>
38 /// <param name="userInfo">传过来一个userInfo对象，得到对象里的用户名和密码</param>
39 private void SetCookie(UserInfo userInfo)
40 {
41     //创建cookie1，为其指定键名是userName，值是输入的用户名。
42     HttpCookie cookie1 = new HttpCookie("userName", userInfo.UserName);
43     //创建cookie1，为其指定键名是userName，值是输入密码。
44     HttpCookie cookie2 = new HttpCookie("userPassword", userInfo.UserPassword);
45     //指定过期为7天。
46     cookie1.Expires = DateTime.Now.AddDays(7);
47     cookie2.Expires = DateTime.Now.AddDays(7);
48     //将创建的Cookie输出到客户端。
49     Response.Cookies.Add(cookie1);
50     Response.Cookies.Add(cookie2);
51 }

 3、下面当我们在浏览器地址栏中输入：http://localhost:8090/Member/Login.aspx(这个是我自己的页面，你输入的地址应该和我的不一样哦)的时候，这个时候会请求Login.aspx页

　　面，第一次会执行get请求然后就会判断Cookie中是否有值，然后根据拿到的值去校验，如果校验成功，那么就跳转页面，如果校验失败就将Cookie设置为过期。　　

 1 protected void Page_Load(object sender, EventArgs e)
 2 {
 3     //如果是Post请求。
 4     if (IsPostBack)
 5     {
 6         string userName = Request.Form["txtName"];
 7         string userPassword = Request.Form["txtPassword"];
 8         string validateCode = Request.Form["txtValidateCode"];
 9         if (Session["ValidateCode"].Equals(validateCode))
10         {
11             UserLogin(userName, userPassword);
12         }
13         else
14         {
15             ShowMsgInfo = "验证码错误";
16             return;
17         }
18     }
19     else  //get请求。
20     {
21         //校验Cookie中的值。
22         if (Request.Cookies["userName"] != null && Request.Cookies["userPassword"] != null)
23         {
24             //得到Cookie中存储的用户名。
25             string userName = Request.Cookies["userName"].Value.ToString();
26             //得到Cookie中存储的密码。
27             string userPassword = Request.Cookies["userPassword"].Value.ToString();
28             //校验用户名，得到一个对象。
29             Model.UserInfo userInfo = userInfoBll.GetUserInfo(userName);
30             //!=null说明数据库里有此用户。
31             if (userInfo != null)
32             {
33                 //如果得到的对象中的方法等于Cookie中存储的数据。
34                 if (userInfo.UserPassword == userPassword)
35                 {    
36                     //跳转。跳转以后就不会执行下面的Cookie过期代码了。
37                     Response.Redirect("/Member/Default.aspx");
38                 }
39             }
40             //如果登陆失败，就为Cookie设置为过期。
41             Response.Cookies["userName"].Expires = DateTime.Now.AddDays(-1);
42             Response.Cookies["userPassword"].Expires = DateTime.Now.AddDays(-1);
43         }
44     }
45 } 

End。