借助Flask框架实现模拟用户登录操作；
一步一步的来实现这个登录接口

login.py

from flask import Flask, render_template,requestapp = Flask(__name__, template_folder='login')@app.route('/')
def hello_flask():data = request.get_data()print(data)return render_template("login.html")if __name__ == '__main__':app.run(host='127.0.0.1', port=5000)

template_folder='login' 登录用的html文件放在login文件夹下面；
login.html

姓名:
密码:
              

运行login.py后端开启服务，在浏览器请求，前端报错，
请求前：

请求后：

后端并未出现明显异常；
后端日志：

Press CTRL+C to quit
b''
127.0.0.1 - - [27/Nov/2022 15:44:56] "GET / HTTP/1.1" 200 -
127.0.0.1 - - [27/Nov/2022 15:45:00] "POST / HTTP/1.1" 405 -

b’’ :这个是我们print(data)这句代码打印的东西，从目前结果看来，后端并未收到前端实际传送回来的数据

从前端报错来看是分方法不允许，这是Flask自己的一种规范导致，路由的默认方法只支持GET方式，其他方式没有被设置；解决方法也比较简单，只需在路由的时候添加： @app.route('/', methods=['get', 'post'])

全部代码

from flask import Flask, render_template, requestapp = Flask(__name__, template_folder='login')@app.route('/', methods=['get', 'post'])
def hello_flask():data = request.get_data()print(data)return render_template("login.html")if __name__ == '__main__':app.run(host='127.0.0.1', port=5000)

启动服务后，前端输入用户名，密码，后端就可以收到数据，接下来对前端传过来的数据做个优化；
全部代码

from flask import Flask, render_template, requestapp = Flask(__name__, template_folder='login')@app.route('/', methods=['get', 'post'])
def hello_flask():user = request.form.get('user')password = request.form.get('password')print(user, '===', password)return render_template("login.html")if __name__ == '__main__':app.run(host='127.0.0.1', port=5000)

前端请求后，后端收到的数据

dd === 1212

这样看下来 ，前后端链路算是通了；

请求方法分离

这一部分主要是将get和post方法隔离开，避免影响逻辑出错

定义一个user_dicts ，模拟数据库查询用户名密码数据来做登录校验。

from flask import Flask, render_template, requestapp = Flask(__name__, template_folder='login')user_dicts = {"zhangsan": "aaa", "lisi": "bbb"}@app.route('/', methods=['GET', 'POST'])
def hello_flask():print(request.method)if request.method == 'GET':return render_template("login.html")user = request.form.get('user')password = request.form.get('password')if user in user_dicts:if user_dicts[user] == password:return render_template("home.html")else:error_msg = {"data": "密码错误"}else:error_msg = {"data": "用户不存在"}return render_template("login.html", error_msg=error_msg)if __name__ == '__main__':app.run(host='127.0.0.1', port=5000)

home.html

Home page

login.html

用户姓名:
用户密码:
{{ error_msg.data }}
         

输入一个错误密码的测试

输入一个用户不存在的测试

前端优化

出现异常字段标红

login.html

用户姓名:
用户密码:
{{ error_msg.data }}
         

短暂的周末又要飞过，加油每一天~~~