zoukankan      html  css  js  c++  java
  • 完成登录功能,用session记住用户名

    登录功能完成:

    1. js:设置return
    2. html:设置
      1. form
      2. input
    3. py:
      1. @app.route设置methods
      2. GET
      3. POST
        1. 读取表单数据
        2. 查询数据库
          1. 用户名密码对:
            1. 记住用户名
            2. 跳转到首页
          2. 用户名密码不对:
            1. 提示相应错误。

    js:

    function fnLogin() {
             var oUname = document.getElementById("uname");
             var oError = document.getElementById("error-box");
             var oUpass = document.getElementById("upass");
             var oUpass1 = document.getElementById("upass1");
             var isoError = true;
             oError.innerHTML = "<br>";
    
             if (oUname.value.length<6||oUname.value.length>20){
                  oError.innerHTML="用户名要6-20位";
                  isoError = false;
                  return;
                    }
                    else if(oUname.value.charCodeAt(0)>=48&&(oUname.value.charCodeAt(0)<=57)){
                 oError.innerHTML = "用户名首位必须为字母";
                 isoError = false;
                 return;
             }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 = "用户名必须为字母或数字";
                        isoError = false;
                        return;
                    }
             }
    
    
              if (oUpass.value.length<6||oUpass.value.length>20){
                        oError.innerHTML="密码至少6-20位";
                         isoError = false;
                          return;
    
                }
                if (oUpass1.value!=oUpass.value){
                          oError.innerHTML="密码不一致,请重新输入";
                          isoError = false;
                          return;
                }
                 return isoError;
                 return window.alert("注册成功!")
            }

    html:

    {% extends 'base.html' %}
    {% block title %}
        login
    {% endblock  %}
    
    {% block head %}
    
        <link rel="stylesheet" type="text/css" href="{{ url_for('static',filename='css/10.31.css') }}">
        <script src="{{ url_for('static',filename='js/10.31.js') }}"></script>
    
    {% endblock  %}
    
    {% block main %}
    <div class="box">
        <div id="title">LoginText</div>
        <h3>登录</h3>
        <form action="{{ url_for('login') }}" method="post">
        <div class="input-box">
            账号:<input id="uname" type="text" name="username" placeholder="请输入用户名">
        </div>
        <div class="input-box">
            密码:<input id="upass" type="password" name="password" placeholder="请输入密码">
        </div>
        <div id="error-box"><br></div>
        <div class="input-box">
            <button onclick="fnLogin()">登录</button>
            <a href="{{ url_for('register') }}">注册/Register</a>
        </div>
            </form>
    </div>
    
    {% endblock  %}

    py:

    @app.route('/login',methods=['GET','POST'])
    def login():
        if request.method == 'GET':
           return render_template('login.html')
        else:
            usern = request.form.get('username')
            passw = request.form.get('password')
            user = User.query.filter(User.username == usern).first()
            if user:
                if user.password == passw:
                    session['user'] = usern
                    session.permanent = True
                    return redirect(url_for('index'))  # 重定向到首页
                else:
                    return u'password error'
            else:
                return u'username is not existed'

    session:

    1. 从`flask`中导入`session`
      from flask import render_template,redirect,url_for,request,session
    2. 设置`SECRET_KEY`
      import os
      
      SELECT_KEY = os.urandom(24)
    3. 操作字典一样操作`session`:增加用户名`session['username']=`username
       session['user'] = usern
       session.permanent = True
  • 相关阅读:
    Problem C: 类的初体验(V)
    接口与继承
    类和对象
    java函数方法
    数组
    string类的一些函数方法
    java语法基础
    大道至简——做个懒人
    java编程 求和
    编程的精义
  • 原文地址:https://www.cnblogs.com/liminghui3/p/7871811.html
Copyright © 2011-2022 走看看