Flask使用Flask-WTF表单

Flask-WTF

Flask-WTF是Flask框架的表单验证模块，Flask-WTF将表单数据解析、CSRF保护、文件上传等功能与Flask集成。

安装

Flask-WTF及其依赖可使用pip安装

pip install flask-wtf

安装成功如下：
在这里插入图片描述

跨站请求伪造保护

默认请求下，Flask-WTF能保护所有表单免受跨站请求伪造(CSRF)的攻击。为了实现CSRF保护，Flask-WTF需要程序设置一个密钥。Flask-WTF使用这个密钥生成加密令牌，再用令牌验证请求中表单数据的真伪。设置密钥的语句如下：

# secret_key内容可以自行定义，可以随便写一个值
app.secret_key = "secret from"

创建表单类

使用Flask-WTF时，每个Web表单都由一个继承自Form的类表示。这个类定义表单中的一组字段，每个字段都用对象表示。字段对象可附属一个或多个验证函数。验证函数用来验证用户提交的输入值是否符合要求。
如下创建一个简单的Web表单。

from flask_wtf import FlaskForm
from wtforms import StringField, PasswordField, SubmitField
from wtforms import validators

# 定义一个表单类
class LoginForm(FlaskForm):
    # 定义一个文本框，提示信息为用户名，validators设置验证规则，参数是一个列表，可以添加多个验证函数，DataRequired不能为空验证函数
    username = StringField("用户名：", validators=[validators.DataRequired()])
    # 定义一个密码框
    password = PasswordField("密码：", validators=[validators.DataRequired()])
    # 定义一个提交按钮
    submit = SubmitField("提交")

定义了一个登录的form表单，其中有输入用户名和密码的文本框和一个表单提交按钮。除了上面定义的字段和验证规则外，还有一些常用的字段和验证规则，如下表。

WTForms支持的HTML字段

字段类型	说明
StringField	文本字段
TextAreaField	多行文本字段
PasswordField	密码文本字段
HiddenField	隐藏文本字段
DateField	文本字段，值为datetime.date格式
DateTimeField	文本字段，值为datetime.datetime格式
IntegerField	文本字段，值为整数
DecimalField	文本字段，值为decimal.Decimal
FloatField	文本字段，值为浮点数
BooleanField	复选框，值为True和False
RadioField	一组单选框
SelectField	下拉列表
SelectMultipleField	下拉列表，可选择多个值
FileField	文件上传字段
SubmitField	表单提交按钮
FormField	把表单作为字段嵌入另一个表单
FieldList	一组指定类型的字段

WTForms验证函数

验证函数	说明
Email	验证电子邮件地址
EqualTo	比较两个字段的值；常用于要求输入两次密码进行确认的情况
IPAddress	验证IPv4网络地址
Length	验证输入字符串的长度
NumberRange	验证输入的值在数字返回内
Optional	无输入值时跳过其他验证函数
DataRequired	确保字段中有数据
Regexp	使用正则表达式验证输入值
URL	验证URL
AnyOf	确保输入值在可选值列表中
NoneOf	确保输入值不值可选值列表中

定义视图函数

定义一个视图函数，请求方式设置为GET和POST请求，请求跳转到表单页面，POST请求为表单提交请求，如果是PSOT请求，则输出接收到表单传递过来的内容。代码如下：

@app.route('/login', methods=['GET', 'POST'])
def login():
    form = LoginForm()
    if request.method == 'POST':
        # 获取form表单提交过来的值
        username = form.username.data
        pwd = form.password.data
        print(username, pwd, sep='====')
    return render_template("login.html", form=form)

把表单类当做参数传递到表单页面。

渲染表单

把表单渲染为HTML文件，代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<form method="post">
    {# label为表单类中定义此属性函数的第一个参数，如果需要添加样式，可以为字段指定id或class属性 #}
    {
   
   { form.username.label }}{
   
   { form.username(id = 'username') }}<br>
    {
   
   { form.password.label }}{
   
   { form.password }}<br>
    {
   
   { form.submit }}
</form>
</body>
</html>

渲染后页面效果如下：
在这里插入图片描述
点击提交后，控制台输出视图函数中接收到表单提交的数据。