Flask 是一个轻量级的 Python Web 框架，非常适合用来快速开发 web 应用。本文将介绍如何使用 Flask 实现一个简单的用户登录功能，前端与后端整合，供读者参考和学习。
准备工作
在开始之前，请确保你已经安装了 Flask。如果没有安装，可以通过以下命令进行安装：
pip install Flask
接下来，我们将会创建一个包含用户登录功能的简单示例。
项目结构
首先，我们创建一个项目文件夹，结构如下：
flask_login_demo/
│
├── app.py
└── templates/
├── login.html
└── home.html
后端实现
接下来，我们编写 app.py 文件，代码如下：
from flask import Flask, render_template, request, redirect, url_for, session, flash
app = Flask(__name__)
app.secret_key = 'your_secret_key' # 必须设置，确保 session 的安全性
# 模拟用户数据库
users = {
"user1": "password1",
"user2": "password2"
}
@app.route('/')
def home():
return render_template('home.html')
@app.route('/login', methods=['GET', 'POST'])
def login():
if request.method == 'POST':
username = request.form['username']
password = request.form['password']
# 检查用户名和密码
if username in users and users[username] == password:
session['username'] = username
flash('登录成功！', 'success')
return redirect(url_for('home'))
else:
flash('用户名或密码错误！', 'danger')
return render_template('login.html')
@app.route('/logout')
def logout():
session.pop('username', None)
flash('你已成功退出！', 'info')
return redirect(url_for('home'))
if __name__ == '__main__':
app.run(debug=True)
前端实现
接下来，我们在 templates 文件夹中创建两个 HTML 文件：login.html 和 home.html。
login.html
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>登录</title>
</head>
<body>
<h1>用户登录</h1>
<form method="POST" action="{{ url_for('login') }}">
<div>
<label for="username">用户名:</label>
<input type="text" name="username" required>
</div>
<div>
<label for="password">密码:</label>
<input type="password" name="password" required>
</div>
<div>
<button type="submit">登录</button>
</div>
</form>
{{ get_flashed_messages() }}
</body>
</html>
home.html
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>主页</title>
</head>
<body>
<h1>欢迎来到主页</h1>
{% if session.username %}
<p>你好, {{ session.username }}!</p>
<a href="{{ url_for('logout') }}">退出</a>
{% else %}
<a href="{{ url_for('login') }}">登录</a>
{% endif %}
{{ get_flashed_messages() }}
</body>
</html>
运行应用
确保已完成以上代码编写后，在终端运行以下命令启动 Flask 应用：
python app.py
打开浏览器访问 http://127.0.0.1:5000/，你将看到欢迎页面。点击“登录”链接进入登录页面，输入用户名和密码（比如 user1 和 password1），成功登录后，会跳转回主页并显示欢迎信息。
结尾
通过以上步骤，我们创建了一个简单的用户登录功能，前后端实现了基本的交互。在实际开发中，你可能还会需要进一步强化安全性，比如使用密码哈希存储、添加验证码等。但这个示例为你打下了基础。希望本文对你有帮助，欢迎大家进行更多的探索和实践！
