完成登录功能

  1. js:设置return
    复制代码
    function fnLogin() {
        var oUname = document.getElementById("uname")
        var oError = document.getElementById("error_box")
        var oUpass = document.getElementById("upass")
        var isError=true;
        oError.innerHTML = "<br>"
    
        if (oUname.value.length < 6 || oUname.value.length > 12) {
            oError.innerHTML = "用户名为6到12位";
            isError=false;
            return isError;
        } else if( (oUname.value.charCodeAt(0) >= 48) && (oUname.value.charCodeAt(0) <= 57)){
            oError.innerHTML = "用户名首位不能是数字";
            isError=false;
            return isError;
        } else for (var i = 0; i < oUname.value.length; i++) {
            if ((oUname.value.charCodeAt(i) < 48) || (oUname.value.charCodeAt(i) > 57) && (oUname.value.charCodeAt(i) < 97) || (oUname.value.charCodeAt(i) > 122)) {
                oError.innerHTML = "用户名只能是字母与数字";
                isNotError=false;
                return isError;
            }
        }
        if ((oUpass.value.length < 6) || (oUpass.value.length > 20)) {
            oError.innerHTML = "密码为6到20位";
            return
        }
        return true;
        //window.alert("登录成功!!")
    }
    复制代码
  2. html:设置
    1. form
    2. input
      复制代码
      <div class="box" >
          <h2 >LOGIN</h2>
           <form action="{{url_for('login') }}" method="post">
              <div class="input_box">
                  账户:<input id="uname" type="text" placeholder="请输入用户名" name="username">
              </div>
              <div class="input_box">
                  密码:<input id="upass" type="password" placeholder="请输入密码" name="password">
              </div>
              <div id="error_box"><br></div>
              <div class="input_box">
                  <button onclick="fnLogin()">登录</button>
              </div>
          </form>
          </div>
      复制代码
  3. py:
    1. @app.route设置methods
    2. GET
    3. POST
      1. 读取表单数据
      2. 查询数据库
        1. 用户名密码对:
          1. 记住用户名
          2. 跳转到首页
        2. 用户名密码不对:
          1. 提示相应错误。
            复制代码
            @app.route('/login/',methods=['GET','POST'])
            def login():
                # if request.method == 'GET':
                #     return render_template('1031.html')
                # else:
                #     usern = request.form.get('username')  # 获取form中的数据
                #     passw = request.form.get('password')
                #     user = User.query.filter(User.username == usern).first()  # 判断用户名是否存在
                #     if user:
                #         if user.password ==passw:
                #             return redirect(url_for('index'))
                #         else:
                #             return 'password error'
                #     else:
                #         return 'username is not existed'
            复制代码

session:

  1. 从`flask`中导入`session`
    from flask import Flask,render_template,request,redirect,url_for,session
  2. 设置`SECRET_KEY`
    复制代码
    import os
    
    DEBUG =True
    
    SECRET_KEY = os.urandom(24)
    
    DIALECT ='mysql'
    DRIVER ='mysqldb'
    USERNAME='root'
    PASSWORD=''
    HOST='localhost'
    PORT='3306'
    DATABASE='Y_db'
    
    # SQLALCHEMY_DATABASE_URI = 'mysql+pymysql://root:@127.0.0.1:3306/yuan_db?charset=utf8'
    SQLALCHEMY_DATABASE_URI = 'mysql+pymysql://root:@localhost:3306/Y_db?charset=utf8'
    SQLALCHEMY_TRACK_MODIFICATIONS = False
    复制代码
  3. 操作字典一样操作`session`:增加用户名`session['username']=`username
    复制代码
    @app.route('/login/',methods=['GET','POST'])
    def login():
        if request.method == 'GET':
            return render_template('1031.html')
        else:
            usern = request.form.get('username')
            passw = request.form.get('password')
            user = User.query.filter(User.username == usern).first()
            # 判断用户名是否存在
            if user:
                session['user'] = usern
                session.permanent = True
                if user.password == passw:
                    return redirect(url_for('shouye'))
                else:
                    return 'password error' 
            else:
                return 'username is not existed'
    复制代码
原文地址:https://www.cnblogs.com/lianghaohui123/p/7875319.html