我,而且用自动记住的密码登录总也登录不上这是咋回事啊?用的是360安全浏览器账号和密码的位置是黄色的

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了我,而且用自动记住的密码登录总也登录不上这是咋回事啊?用的是360安全浏览器账号和密码的位置是黄色的相关的知识,希望对你有一定的参考价值。

这是由于你输入的账号密码错误造成的,建议你重新输入正确的账号密码就可以了。 参考技术A 你好朋友这个情况可能是上次登录时保存的密码不对,建议重新输入正确的帐号和密码登录 参考技术B 重新输入正确密码。

基于localStorge开发登录模块的记住密码与自动登录



 

前沿||我是乐于分享,善于交流的鸟窝 先做写一篇关于登录模块中记住密码与自动登录的模块。鸟窝微信:jkxx123321

关于这个模块功能模块的由来,这是鸟大大的处女秀,为什么这么说呢?一天在群里,一个哥们说有私活,开发一个****模块,我那天手痒痒就和他聊了两句,然后,就决定给她做这个模块了,和他谈了谈交付时间,他说最迟两天,然后谈了谈加个,最后达成,500¥!!!这个模块其实第一天晚上我就开发出来了,那时我给他微信说,功能模块开发ok了,要不要远程查看一下,没问题的话就交了,一会他回我,好了就发过来,然后微信就转过来500¥,当时很诧异,毕竟是处女秀,然后就把项目交给他了,并且是完美交付,在客户那里,也没有出现问题!到如今想想,还激动啊!记录那个时刻--2016-3。

摘要:传动的记住密码与自动登录模块,都是基于cookie,但是cookie上做的话,有一些弊端,鸟看了就是cookie文件大小受限,所以本问叙述的是基于H5上的storge,本地持久化存储来做的自动登录和记住密码的,所以如果你不懂storge的话,建议先去充电!

充电:了解localstorge

备注:这是一个仿网页知乎的登录模块,如果想要完整源码,可以联系鸟哦

效果图:

 

核心源码分享:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">

    <title>登录 - 仿知乎 - Thousands Find</title>
    <link rel="stylesheet" type="text/css" href="style/register-login.css">
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script>
        $(document).ready(function () {
            //读取 localStage 本地存储,填充用户名密码,如果自动登录有值直接跳转;    
            //相反,跳转到本页面,等待登陆处理    
            var storage = window.localStorage;
            var getEmail = storage["email"];
            var getPwd = storage["password"];
            var getisstroepwd = storage["isstorePwd"];
            var getisautologin = storage["isautologin"];
            if ("yes" == getisstroepwd) {
                if ("yes" == getisautologin) {
                    if ((("" != getEmail) || (null != getEmail)) && (("" != getPwd) || (null != getPwd))) {
                        //lacoste  已经保存 登陆信息 直接登陆    
                         //alert(\'正在自动登录\');  
                        $("#email").val(getEmail);
                        $("#password").val(getPwd);
                        // window.location="";     
                        //加载时显示:正在自动登录  
                        $.ajax({
                            url: \'LoginServlet.ashx\',
                            data: {
                                email: getEmail,
                                password: getPwd
                            },
                           
                            dataType: \'json\',
                            success: function (data) {
                                if (data.msg == "") {
                                    alert("账号信息异常,请核实后重新登录");
                                } else {
                                    //alert(123);
                                    //登录成功后保存session,如果选择了记住密码,再保存到本地  
                                    window.location.href =\'Default2.aspx\';  
                                }
                            },
                            error: function () {
                                alert("系统错误");
                            }
                        });
                    }
                }
                else {
                    $("#email").val(getEmail);
                    $("#password").val(getPwd);
                    document.getElementById("isRemberPwdId").checked = true;
                }
            }
        });
        
        
        function login() {
            var userEmail = $("#email").val();
            var userPassWord = $("#password").val();
            if (userEmail != "" && userPassWord != "") {


                var storage = window.localStorage;
                //记住密码    
                if (document.getElementById("isRemberPwdId").checked) {
                    //存储到loaclStage      
                    //alert(134);
                    storage["email"] = userEmail;
                    storage["password"] = userPassWord;
                    storage["isstorePwd"] = "yes";
                }
                else {
                    storage["email"] = userEmail;
                    storage["isstorePwd"] = "no";
                }

                //下次自动登录    
                if (document.getElementById("isAutoLoginId").checked) {
                    //存储到loaclStage      
                    storage["email"] = userEmail;
                    storage["password"] = userPassWord;
                    storage["isstorePwd"] = "yes";
                    storage["isautologin"] = "yes";
                }
                else {
                    storage["email"] = userEmail;
                    storage["isautologin"] = "no";
                }
                $.ajax({
                    url: \'LoginServlet.ashx\',
                    data: {
                        "email": userEmail,
                        "password": userPassWord
                    },
                    dataType: \'json\',
                    success: function (data) {
                        if (data.msg == "") {
                            alert("用户名或密码错误");
                        } else {
                            alert("登陆成功");
                            //登录成功后保存session,如果选择了记住密码,再保存到本地  
                            window.location.href = \'Default.aspx\';
                        }
                    },
                    error: function () {
                        alert("系统错误1");
                    }
                });
                //alert("登录成功");
            }
            else {
                alert("用户名密码不能为空");
            }
        }
        
    </script>
</head>
<body>
    <div id="box"></div>
    <div class="cent-box">
        <div class="cent-box-header">
            <h1 class="main-title hide">仿知乎</h1>
            <h2 class="sub-title">生活热爱分享 - Thousands Find</h2>
        </div>

        <div class="cont-main clearfix">
            <div class="index-tab">
                <div class="index-slide-nav">
                    <a href="login.html" class="active">登录</a>
                    <a href="register.html">注册</a>
                    <div class="slide-bar"></div>
                </div>
            </div>
            <form id="loginform" name="loginform" autocomplete="on" method="post">
                <div class="login form">
                    <div class="group">
                        <div class="group-ipt email">
                            <input type="email" name="email" id="email" class="ipt" placeholder="邮箱地址" required/>
                        </div>
                        <div class="group-ipt password">
                            <input type="password" name="password" id="password" class="ipt" placeholder="输入您的登录密码" required/>
                        </div>

                    </div>
                </div>

                <div class="button">
                    <button type="button" class="login-btn register-btn" id="button" onclick="login()">登录</button>
                </div>

                <div class="remember clearfix">

                    <label for="loginkeeping" class="remember-me">
                        <input type="checkbox" name="isRemberPwdId" id="isRemberPwdId" class="remember-mecheck" checked />
                        记住密码&nbsp;
                    </label>

                    <label for="autologin" class="forgot-password">
                        <input type="checkbox" name="isAutoLoginId" id="isAutoLoginId" class="remember-mecheck" checked />
                        自动登录&nbsp;
                    </label>

                </div>
            </form>
        </div>
    </div>

    <div class="footer">
        <p>仿知乎 - Thousands Find</p>
        <p>copy@*.*  2016</p>
    </div>

    <script src=\'js/particles.js\' type="text/javascript"></script>
    <script src=\'js/background.js\' type="text/javascript"></script>
    <script src=\'js/jquery.min.js\' type="text/javascript"></script>
    
    <script src=\'js/layer/layer.js\' type="text/javascript"></script>
    <script src=\'js/index.js\' type="text/javascript"></script>

</body>
</html>

 

 最后总结一下:

这个模块是通用的,我们要做的是:

1.当用户点击登录的时候,首先拿到表单里的数据 
2.做出判断,判断用户是否勾选记住密码 或者 自动登录

3.都没勾选,对数据进行加密,发到服务器端做登录校验,之后返回

4.勾选了记住密码,就将用户名密码保存到storge,核心代码赞一下

var storage = window.localStorage;
                //记住密码    
                if (document.getElementById("isRemberPwdId").checked) {
                    //存储到loaclStage      
                    //alert(134);
                    storage["email"] = userEmail;
                    storage["password"] = userPassWord;
                    storage["isstorePwd"] = "yes";
                }
                else {
                    storage["email"] = userEmail;
                    storage["isstorePwd"] = "no";
                }

记住,这时你已经勾选了记住密码,下次登录时,该如何操作?

在$(function (){})里,也就是浏览器渲染标签时,做出判断,看一下storge[\'isstorePwd\']是否为yes,核心代码赞一赞

$(document).ready(function () {
            //读取 localStage 本地存储,填充用户名密码,如果自动登录有值直接跳转;    
            //相反,跳转到本页面,等待登陆处理    
            var storage = window.localStorage;
            var getEmail = storage["email"];
            var getPwd = storage["password"];
            var getisstroepwd = storage["isstorePwd"];
            var getisautologin = storage["isautologin"];
            if ("yes" == getisstroepwd) {
                if ("yes" == getisautologin) {
                   ....
                    }
                }
                else {
                    $("#email").val(getEmail);
                    $("#password").val(getPwd);
                    document.getElementById("isRemberPwdId").checked = true;
                }
            }
        });

ok 如果记住密码就搞定了!

5.自动登录:这个功能还用我说吗?和记住密码类似!

//下次自动登录    
                if (document.getElementById("isAutoLoginId").checked) {
                    //存储到loaclStage      
                    storage["email"] = userEmail;
                    storage["password"] = userPassWord;//密码存到storage里
                    storage["isstorePwd"] = "yes";
                    storage["isautologin"] = "yes";
                }
                else {
                    storage["email"] = userEmail;
                    storage["isautologin"] = "no";
                }

当用户再次登录的时候,还是在一加载的时候,做出判断,是否勾选自动登录,勾选的话,从storage里拿到数据,直接发生异步

请求,就不用用户做出点击登录事件了!

if ("yes" == getisautologin) {
                    if ((("" != getEmail) || (null != getEmail)) && (("" != getPwd) || (null != getPwd))) {
                        //lacoste  已经保存 登陆信息 直接登陆    
                         //alert(\'正在自动登录\');  
                        $("#email").val(getEmail);
                        $("#password").val(getPwd);
                        // window.location="";     
                        //加载时显示:正在自动登录  
                        $.ajax({
                            url: \'LoginServlet.ashx\',
                            data: {
                                email: getEmail,
                                password: getPwd
                            },
                           
                            dataType: \'json\',
                            success: function (data) {
                                if (data.msg == "") {
                                    alert("账号信息异常,请核实后重新登录");
                                } else {
                                    //alert(123);
                                    //登录成功后保存session,如果选择了记住密码,再保存到本地  
                                    window.location.href =\'Default2.aspx\';  
                                }
                            },
                            error: function () {
                                alert("系统错误");
                            }
                        });

好了,花了二十分钟,总结完毕,爱分享的鸟窝!

请随意打赏

 

 

 

(微信扫码)

 

 

 

 

以上是关于我,而且用自动记住的密码登录总也登录不上这是咋回事啊?用的是360安全浏览器账号和密码的位置是黄色的的主要内容,如果未能解决你的问题,请参考以下文章

登不上钉钉怎么办

C#窗体记住密码和自动登录怎么弄

网页登录怎么记住密码

LINUX 用ssh远程登录服务器输入密码之后不动了,怎么回事啊

Mysql 数据库偶尔连接不上 怎么回事?

Cookie实现记住密码自动登录功能