一、首先是实现注册功能
1、我们先创建一个存储表单信息的py文件,叫做form.py。然后写一个注册类的表单,用Flask-WTF这个类来实现,具体代码如下:
form.py文件内容
from flask_wtf import FlaskFormfrom wtforms import StringField, PasswordField, SubmitField, IntegerFieldfrom wtforms.validators import DataRequired, EqualTo, Length
class RegisterForm(FlaskForm):"""定义表单类"""username = StringField(label=u"用户名", validators=[DataRequired(u"用户名不能为空")])password = PasswordField(label=u"密码", validators=[DataRequired(u"密码不能为空"), Length(8, 128)])password1 = PasswordField(label=u"验证密码", validators=[DataRequired(u"验证密码不能为空"), EqualTo("password", u"两次密码不一样")])phone = IntegerField('手机号', validators=[DataRequired()])submit = SubmitField(label=u"提交")
2、然后我们需要在templates这个文件里创建一个注册的html页面,叫做register.html,内容如下
{% block content_title %}<h1 align="center" >欢迎来到注册页面</h1>{% endblock %}{% block content %}<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.password1.label }}{{ form.password1(class='form-control') }}</div><div class="form-group">{{ form.phone.label }}{{ form.phone(class='form-control') }}</div>{{ form.submit(class='btn btn-primary') }}</form>{% endblock %}
3、最后在主文件里(以我的为例app.py)写注册路由和视图函数,在前端页面上渲染register.html页面,代码如下:
app.py 文件内容
# 注册用户信息
from form import RegisterForm, LoginForm, RichTextFormfrom flask import Flask, render_template, redirect, url_for, session, flash, request, abortfrom flask_moment import Momentfrom flask_wtf import Form# 这里是设置一个密钥,对数据进行签名以加密数据app.config["SECRET_KEY"] = "abcdefgh12344ijklmn904opq"
@app.route("/register", methods=["GET", "POST"])def register():form = RegisterForm()if form.validate_on_submit():print(request.method)print(form.validate_on_submit())"""验证通过"""username = form.username.data# password = form.password.data# passwor1d = form.password1.datasession["username"] = usernamereturn redirect(url_for("login"))# else:#flash("欢迎注册!")return render_template("register.html", form=form)
这时候我们运行代码,在前端网页上输入127.0.0.1:5000/register时,如下图所示(我这里用了bootstrap风格,会美化前端页面)
当我们写好用户名、密码、验证密码、手机号时(对了,密码在表单时,要求是8位数字以上),点提交时,会跳转到登录页面。所以第二步写登录功能
二、登录功能的实现
1、在form.py文件内容里加上登录的表单,代码如下:
from flask_wtf import FlaskFormfrom wtforms import StringField, PasswordField, SubmitField, IntegerFieldfrom wtforms.validators import DataRequired, EqualTo, Length
class LoginForm(FlaskForm):"""定义用户登录表单类"""username = StringField(label=u"用户名", validators=[DataRequired(u"用户名不能为空")])password = PasswordField(label=u"密码", validators=[DataRequired(u"密码不能为空")])submit = SubmitField(label=u"提交")
2、然后我们需要在templates这个文件里创建一个登录的html页面,叫做login.html,内容如下:
{% block content_title %}<h1 align="center" >欢迎来到登录页面</h1>{% endblock %}{% block content %}<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 %}
3、最后在主文件里(以我的为例app.py)写登录路由和视图函数,在前端页面上渲染register.html页面,代码如下:
@app.route("/login", methods=["GET", "POST"])def login():form = LoginForm()# print(form.validate_on_submit())# print(request.method)if form.validate_on_submit():print(request.method)print(form.validate_on_submit())"""验证通过"""username = form.username.datapassword = form.password.datasession["username"] = usernamereturn redirect(url_for("welcome"))# else:#flash("欢迎登录!")return render_template("login.html", form=form)
@app.route("/welcome")def welcome():username = session.get("username", "Stranger")return "%s 登录成功!" % username
这时候我们运行代码,在前端网页上输入127.0.0.1:5000/login时,如下图所示(我这里用了bootstrap风格,会美化前端页面)
当我们写好用户名、密码时,点提交时,会跳转welcome页面时,会提示用户名谁谁谁登录成功
这里我们并没用去验证登录的用户名和密码,如果想验证的话,就需要添加数据库这一功能,将注册的用户名和密码存到数据库中,然后再登录界面上验证。