好的，下面是一个
简单的
登录注册页面的
Python 实现，使用 Flask 框架和 SQLite 数据库：
首先，需要安装 Flask 和 Flask-WTF 扩展：
```
pip install Flask Flask-WTF
```
然后创建一个名为 `app.py` 的文件，并粘贴以下代码：
```
python
from flask import Flask, render_template, request, redirect, url_for, flash
from flask_wtf import FlaskForm
from wtforms import StringField, PasswordField, SubmitField
from wtforms.validators import DataRequired, EqualTo
import sqlite3
app = Flask(__name__)
app.config['SECRET_KEY'] = 'secret' # 需要设置一个 secret key 来保护表单数据
# 创建
用户信息表
conn = sqlite3.connect('users.db')
c = conn.cursor()
c.execute('''CREATE TABLE IF NOT EXISTS users
(id INTEGER PRIMARY KEY AUTOINCREMENT,
username TEXT NOT NULL UNIQUE,
password TEXT NOT NULL)''')
conn.commit()
conn.close()
class LoginForm(FlaskForm):
username = StringField('Username', validators=[DataRequired()])
password = PasswordField('Password', validators=[DataRequired()])
submit = SubmitField('Log In')
class RegisterForm(FlaskForm):
username = StringField('Username', validators=[DataRequired()])
password = PasswordField('Password', validators=[DataRequired()])
confirm_password = PasswordField('Confirm Password', validators=[DataRequired(), EqualTo('password')])
submit = SubmitField('Register')
@app.route('/', methods=['GET', 'POST'])
def login():
form = LoginForm()
if form.validate_on_submit():
# 检查
用户名和密码是否匹配
conn = sqlite3.connect('users.db')
c = conn.cursor()
c.execute("SELECT * FROM users WHERE username = ? AND password = ?", (form.username.data, form.password.data))
user = c.fetchone()
conn.close()
if user:
flash('Logged in successfully!', 'success')
return redirect(url_for('home'))
else:
flash('Invalid username or password', 'danger')
return render_template('login.html', form=form)
@app.route('/register', methods=['GET', 'POST'])
def register():
form = RegisterForm()
if form.validate_on_submit():
# 将
用户信息插入数据库
conn = sqlite3.connect('users.db')
c = conn.cursor()
c.execute("INSERT INTO users (username, password) VALUES (?, ?)", (form.username.data, form.password.data))
conn.commit()
conn.close()
flash('Account created successfully! Please log in.', 'success')
return redirect(url_for('login'))
return render_template('register.html', form=form)
@app.route('/home')
def home():
return render_template('home.html')
if __name__ == '__main__':
app.run(debug=True)
```
接下来，需要创建三个 HTML 模板文件，分别为 `login.html`、`register.html` 和 `home.html`。
`login.html`：
```html
{% extends 'base.html' %}
{% block content %}
<h1>Log In</h1>
{% with messages = get_flashed_messages(with_categories=true) %}
{% if messages %}
{% for category, message in messages %}
<div class="alert alert-{{ category }}">{{ message }}</div>
{% endfor %}
{% endif %}
{% endwith %}
<form method="POST">
{{ form.csrf_token }}
<div class="form-group">
{{ form.username.label }}
{{ form.username(class='form-control') }}
</div>
<div class="form-group">
{{ form.password.label }}
{{ form.password(class='form-control') }}
</div>
{{ form.submit(class='btn btn-primary') }}
</form>
{% endblock %}
```
`register.html`：
```html
{% extends 'base.html' %}
{% block content %}
<h1>Register</h1>
{% with messages = get_flashed_messages(with_categories=true) %}
{% if messages %}
{% for category, message in messages %}
<div class="alert alert-{{ category }}">{{ message }}</div>
{% endfor %}
{% endif %}
{% endwith %}
<form method="POST">
{{ form.csrf_token }}
<div class="form-group">
{{ form.username.label }}
{{ form.username(class='form-control') }}
</div>
<div class="form-group">
{{ form.password.label }}
{{ form.password(class='form-control') }}
</div>
<div class="form-group">
{{ form.confirm_password.label }}
{{ form.confirm_password(class='form-control') }}
</div>
{{ form.submit(class='btn btn-primary') }}
</form>
{% endblock %}
```
`home.html`：
```html
{% extends 'base.html' %}
{% block content %}
<h1>Welcome!</h1>
<p>You have successfully logged in.</p>
{% endblock %}
```
最后，还需要创建一个名为 `base.html` 的
基础模板，包含了共享的 HTML 结构和样式：
```html
<!DOCTYPE html>
<html>
<head>
<title>{% block title %}Flask Login/Register{% endblock %}</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"
integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI"
crossorigin="anonymous">
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="#">Flask Login/Register</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav"
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="{{ url_for('login') }}">Log In</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{{ url_for('register') }}">Register</a>
</li>
</ul>
</div>
</nav>
<div class="container mt-4">
{% block content %}{% endblock %}
</div>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"
integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"
integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"
integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI"
crossorigin="anonymous"></script>
</body>
</html>
```
现在，运行 `
python app.py` 启动应用程序，然后在浏览器中访问 `http://localhost:5000` 即可看到登录和注册页面。
944
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
