Flask--登录页面应用案例

文章目录

前言
一、登录页request
二、登录页template
三、实现效果

前言

使用flask的request、templates结合，可实践一个登录小项目

一、登录页request

from flask import Flask
from flask import render_template
from flask import request
app = Flask(__name__)


@app.route('/login', methods=['POST', 'GET'])
def login():
    error = None
    if request.method == 'POST':
        if request.form['username'] == 'test':
            return request.form['username']
        else:
            error = 'Invalid username/password'
    return render_template('user.html', error=error)


if __name__ == '__main__':
    app.run()
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

二、登录页template

代码如下（示例）：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <style>
        * {
            padding: 0;
            margin: 0;
            box-sizing: border-box;
        }

        li {
            list-style: none;
        }

        a {
            text-decoration: none;
        }

        body {
            background-color: lightskyblue;
        }

        .login {
            text-align: center;
            margin-top: 100px;
        }

        .login ul li input[type=text],
        .login ul li input[type=password] {
            font-size: 16px;
        }

        .login ul li input {
            width: 275px;
            height: 40px;
            margin-top: 20px;
        }

        .login ul li input[type=submit] {
            width: 100px;
            height: 40px;
        }
    </style>
</head>
<body>
    <form class="login" method="post">
        <h2>登录</h2>
        <ul>
            <li>
                用户名：<input type="text" name="username" id="user" placeholder="输入用户名">
            </li>
            <li>
                密&emsp;码：<input type="password" name="pwd" id="psw" placeholder="输入密码">
            </li>
            <li><input type="submit" value="登录"></li>
            <li>还没有账号？<a href="注册.html">点击注册</a></li>
        </ul>
       <div>
            <p>{% if  error %} {{ error }} {% endif %}</p>
        </div>
    </form>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64

三、实现效果

访问地址：http://127.0.0.1:5000/login
在这里插入图片描述

相关阅读:
喜讯|宏时数据获得CMMI3级认证！欢迎了解自研统一运维监控平台！
sysbench测试系统磁盘读写
【PyQt】调整子控件的层级以调整绘制的先后顺序
Python 进阶语法：JSON
Java代码实现贪吃蛇游戏
分布式之计算高性能
动态库和静态库，混合使用下的单例bug
mybatis中的if-else语句！！！
洛谷P6586 蒟蒻火锅的盛宴
学习笔记 React（一）Hello React例子

原文地址：https://blog.csdn.net/weixin_44688529/article/details/126617774