本文共 3234 字，大约阅读时间需要 10 分钟。

视频中讲到：

when users need to provide information to the web application, they fill out forms.

作者说flask_wtf这个名字有些奇怪，天啊，WTF，以前都没发现

---

首先，有一个单行文本输入框和一个提交按钮的Web表单：

index.html

{% extends "base.html" %}{% block content %}
   
    
    
        
             
         
    
    {% if name %}        
    
Hello, {
   { name }}!
    {% endif %}
   
{% endblock %}

1. 先是继承了base.html模板中的网页标题和导航栏。
2. <form method="POST"> ：form标签标志这是一个Web表单，指明表单提交方法为POST，HTTP方法，用来在请求中提交数据。
3. <input type="text" name="name">是一个单行文本输入字段，名字为"name"
4. <input type="submit" name="submit">是一个提交按钮。

网页中显示效果：

---

flask代码：

from flask import Flask, render_template, requestfrom flask_bootstrap import Bootstrapapp = Flask(__name__)bootstrap = Bootstrap(app)@app.route('/',methods=["GET","POST"])def index():    name = None  # name 默认值为None，模板中的 if 语句不成立。    # 用户的请求中如果HTTP方法是"POST"，并且用户提交的表单中有 name 属性（name="name"）运行之后的代码    if request.method == "POST" and 'name' in request.form:        name = request.form['name']  # 将用户提交的表单中 name 字段的值赋给一个 name 变量。    return render_template("index.html",name=name)  # 将name变量作为参数传递到index.html模板中，默认的是None, 用户输入值后存储用户输入数据。@app.errorhandler(404) def page_not_found(e):    return render_template("404.html"),404if __name__ == '__main__':    app.run(debug=True)

这次输入名字后：

---

当需要处理大型的Web 表单，同时需要验证表单输入数据时。

可以使用flask_wtf扩展包。

安装flask_wtf ： pip install flask_wtf

flask_wtf中有FlaskForm类，需要创建表单时，继承这个FlaskForm类写一个表单类，再添加自己需要的属性（字段）就成了一个Web表单。

安装flask_wtf时会顺便安装wtforms，wtforms中有各种表单字段的类。将这些类实例化作为自己创建表单中的属性，就成了Web表单中的字段。同时wtforms提供了许多验证函数。

---

先看这个CSRF，使用wtforms后，运行程序会报错。

出于安全考虑，用户身份没有验证，如果有人在提交表单的数据掺杂病毒数据，网站会受到威胁。flask应用验证用户身份，所以需要一个密码。

再flask代码中设置secret_key：

if __name__ == '__main__':    app.secret_key = "It's a  Secret key"    app.run(debug=True)

在提交的表单中加上secret_key： {

{ form.csrf_token }}

---

将最开始的web表单用flask_wtf改写一下：

from flask import Flask, render_template, requestfrom flask_bootstrap import Bootstrapfrom flask_wtf import FlaskFormfrom wtforms import StringField, SubmitField, validatorsapp = Flask(__name__)bootstrap = Bootstrap(app)class NameForm(FlaskForm):  #每一个表单类对应着一个Web表单。name、submit属性对应着表单中的字段。    name = StringField("What's your name",[validators.required(),validators.Length(min=1,max=13)])    submit = SubmitField('Submit')  # 第一个参数是表单字段的标签，第二个参数是验证函数，用来验证数据。@app.route('/',methods=["GET","POST"])def index():    name = None    form = NameForm()  #实例化一个NameForm表单。    # 如果请求方法是"POST"，并且用户输入数据满足验证调价，执行之后的代码    if request.method == "POST" and form.validate_on_submit():        name = form.name.data  # 这个form来自用户提交的表单，name是表单中的一个属性，将name字段用户输入数据赋值给name变量。    return render_template("index.html",name=name,form=form)  #传递了两个参数到index.html模板。@app.errorhandler(404) def page_not_found(e):    return render_template("404.html"),404if __name__ == '__main__':    app.secret_key = "It's a  Secret key"    app.run(debug=True)

表单提交成功，且输入数据满足验证函数时，flask代码中name会存储着输入的数据。然后index.html模板中if name语句成立，生成针对个人的欢迎消息：

如果输入数据有不满足验证函数，会输出错误信息。

---

上面只是一个字段，需要自己写标签、错误信息。

如果表单很大，会很麻烦。

1. flask_bootstrap提供了表单渲染方法。
2. {% from "bootstrap/wtf.html" import quick_form %} 和python语法类似。安装flask_bootstrap时会有wtf.html模板。
   这里从wtf.html模板中导入quick_form方法。
3. 然后，渲染表单就变得简单了（hello.py代码较4b版本没有改变，只在index.html中修改了表单渲染方法。）。
4. 表单功能没变，表单变得更好看，也不需要自己写那么多代码了。

---

最后，使用表单读取图片信息。

书上没有，不知道是不是视频太久远了。按照视频中的代码，总是报错，留在这里，和更复杂的表单一起学习。