flask-wtf 表单

Flask WTF表单

flask_wtf: 是通过类的形式来渲染标签,通过函数的形式来验证填写的内容
    好处:
        1.通过函数校验标签
        2.提供了csrf验证机制
使用流程:
1. 安装,导入包
2. 编写类,继承自FlaskFrom,编写字段,验证函数
3. 携带到模板渲染

注意点:
1. wtf表单默认开启了csrf验证
2. 获取wtf表单中数据, 表单名称.字段名.data
3. validate_on_submit()做了两件事情,判断请求方式('POST', 'PUT', 'PATCH', 'DELETE'), 验证表单函数

实例代码:

register.py

from flask import Flask,render_template
from flask_wtf import FlaskForm
from wtforms import StringField,PasswordField,SubmitField
from wtforms.validators import DataRequired,EqualTo

app = Flask(__name__)

app.config["SECRET_KEY"] = "fjdkfjkdkjfjd"

#关闭csrf校验
# app.config["WTF_CSRF_ENABLED"] = False


#编写表单类
class RegisterForm(FlaskForm):
    username = StringField(label="用户名",validators=[DataRequired("用户名不能为空")])
    password = PasswordField(label="密码",validators=[DataRequired("密码不能为空")])
    rePassword = PasswordField(label="确认密码",validators=[DataRequired("确认密码不能为空"),EqualTo("password","需要和上面密码相等")])
    submit = SubmitField("提交")

#页面展示
@app.route('/')
def hello_world():

    #创建表单对象
    form =  RegisterForm()

    #将表单对象渲染到模板中
    return render_template('file02wtf.html',form=form)


#注册处理
@app.route('/register',methods=["POST"])
def register():

    #1.获取数据,根据提交的内容创建表单
    form = RegisterForm()

    #2.校验数据, 验证通过返回True, 否则返回false
    if form.validate_on_submit(): #验证了两部分内容

        #获取数据
        print(form.username.data)
        print(form.password.data)
        print(form.rePassword.data)

        #假设插入到数据库中,注册成功
        return "注册成功"

    #3.注册失败
    return "注册失败"

if __name__ == '__main__':
    app.run(debug=True)

register.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

    <form action="/register" method="post">

        {# 设置隐藏的csrf_token即可 #}
        {{ form.csrf_token() }}

        {{ form.username.label }}
        {{ form.username }}<br>

        {{ form.password.label }}
        {{ form.password }}<br>

        {{ form.rePassword.label }}
        {{ form.rePassword }}<br>

        {{ form.submit }}

    </form>

</body>
</html>

猜你喜欢

转载自blog.csdn.net/weixin_40420525/article/details/80896667