• 大二下学期团队项目(免密登录)


    今日主要与团队成员一同实现了免密登录与记住密码的功能:

    首先用户打开网页会进入电影浏览的页面,如果用户没有记住密码将会跳转到登录页面。

    登录页面:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <link rel="stylesheet" href="../static/css/login.css">
        <script src="../static/js/jquery-1.7.2.min.js"></script>
        <script src="../static/js/register.js"></script>
        <title>树懒电影登录</title>
        <script >
        </script>
    </head>
    <body>
        <div id="container">
            <div id="container-child">
                <div id="img-div"><img src="../static/img/shulan.png"></div>
                <div id="login-div">
                    <div>
                        <p class="p-title">登录您的树懒电影</p>
                        <form id="login-form" method="post">
                            <div class="input-d">
                                <input class="input-text" type="text" name="userphone" id="userphone" placeholder="请输入您的账号">
                            </div>
                            <div class="input-d">
                                <input class="input-text" type="password" name="password" id="password" placeholder="请输入您的密码">
                            </div>
                            <div class="div-input">
                                <div>
                                    <input type="checkbox" value=“1” class=“remeber” onclick="onClickHander(this)">
                                    <label>记住密码</label>
                                </div>
                            </div> 
                            <button type="button" class="login-button" onclick="login_()">&emsp;</button>
                            <div class="footer"> <a href="http://127.0.0.1:5000/regis">注册</a> | <a href="http://127.0.0.1:5000/reset">忘记密码</a></div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </body>
    </html>
    <script>
        var cb=0
        function onClickHander(obj) {
            if(obj.checked==true){
                cb=1
                // alert(cb)
            }else{
                cb=0
                // alert(cb)
            }
        }
        function login_(){
            var userphone=document.getElementById("userphone").value
            var password=document.getElementById("password").value
            // alert(cb)
            $.ajax({
                    url: "/web_login",
                    data: {
                        userphone:userphone,password:password,cb:cb
                    },
                    success: function (data) {
                        //正常验证失败弹窗
                        if (data.data == 0)
                            alert("账号或密码错误!")
                        //验证成功,返回response
                        if (data.data != 0)
                            window.open("http://127.0.0.1:5000/show","_self")
                    },
                    error: function (xhr, type, errorThrown) {
                        print("登录js,验证账号密码ajax请求失败!")
                    }
            })
        }
    </script>

    后台逻辑:

    @app.route('/',methods=['GET', 'POST', 'PUT'])
    def hello_world():
        try:
            cookphone = request.cookies.get('cookphone')
            cookpass = request.cookies.get('cookpass')
            print("获取到的cookie账号密码:" + cookphone + "  " + cookpass)
            if (len(cookpass) != 0 and len(cookphone) != 0):
                res = sql.web_login(cookphone, cookpass)
                print("验证获取到的cookie账号密码:"+str(res))
                if (res == True):
                    session['userphone'] = cookphone
                    return redirect(url_for("hello_world_show"))
                else:
                    return render_template("login.html")
            else:
                return render_template("login.html")
        except:
            print("cookie验证跳转异常!")
            return render_template("login.html")
    #免密登录
    @app.route('/web_login/',methods=['GET', 'POST'])
    def web_login():
        userphone = request.values.get('userphone')
        password=request.values.get('password')
        cb=request.values.get('cb')
        print("是否记住密码: "+cb)            #cb的返回值类型是 str 字符串
        # print(type(cb))
        print("登录账号:"+userphone+"   "+"密码:"+password)
        res=sql.web_login(userphone,password)
        if(res==True):
            session['userphone'] = userphone
            if(cb=="1"):
                print("开始存储cookies登录账号:" + userphone + "   " + "密码:" + password)
                resp = make_response('储存cookies')
                resp.set_cookie('cookphone', userphone, max_age=3600 * 24 * 15)
                resp.set_cookie('cookpass', password, max_age=3600 * 24 * 15)
                print("登录成功且用户选择记住密码,返回response")
                return resp                   #登录成功且用户选择记住密码,返回response
            else:
                print("登录成功 返回 1 状态码")
                return jsonify({"data": 1})  # 登录成功 返回 1 状态码
        else:
            print("登录失败   返回 0 状态码")
            return jsonify({"data":0})  #登录失败   返回 0 状态码
    #用户退出清理cookie
    @app.route('/clean_cookies',methods=['GET', 'POST'])
    def clean_cookies():
        try:
            resp = Response('cookies的删除')
            resp.delete_cookie('cookphone')  # cookies只有在响应返回的时候才能删除
            resp.delete_cookie('cookpass')  # cookies只有在响应返回的时候才能删除
            print("删除cookies成功!")
            return resp                 #成功删除cookies 返回相响应
        except:
            return jsonify({"data":0})  #删除cookies失败   返回 0 状态码
  • 相关阅读:
    Java 正则表达式
    【 D3.js 进阶系列 — 4.0 】 绘制箭头
    d3.js path路径
    java equals 与 hashCode
    ubuntu14 简单安装ffmpeg
    mysql 导入
    Session的生命周期
    Mysql 乱码配置
    51nod1416(dfs)
    51nod1402(贪心)
  • 原文地址:https://www.cnblogs.com/fengchuiguobanxia/p/14805176.html
Copyright © 2020-2023  润新知