视频中讲到:
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 %}
<div class="container">
<form method="POST">
<input type="text" name="name"></input>
<input type="submit" name="submit"></input>
</form>
{% if name %}
<h1>Hello, {{ name }}!</h1>
{% endif %}
</div>
{% endblock %}
- 先是继承了
base.html
模板中的网页标题和导航栏。
<form method="POST">
:form
标签标志这是一个Web表单,指明表单提交方法为POST
,HTTP方法,用来在请求中提交数据。
<input type="text" name="name">
是一个单行文本输入字段,名字为"name"
<input type="submit" name="submit">
是一个提交按钮。
网页中显示效果:
flask代码:
from flask import Flask, render_template, request
from flask_bootstrap import Bootstrap
app = 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"),404
if __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, request
from flask_bootstrap import Bootstrap
from flask_wtf import FlaskForm
from wtforms import StringField, SubmitField, validators
app = 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"),404
if __name__ == '__main__':
app.secret_key = "It's a Secret key"
app.run(debug=True)
表单提交成功,且输入数据满足验证函数时,flask代码中name
会存储着输入的数据。然后index.html
模板中if name
语句成立,生成针对个人的欢迎消息:
如果输入数据有不满足验证函数,会输出错误信息。
上面只是一个字段,需要自己写标签、错误信息。
如果表单很大,会很麻烦。
flask_bootstrap
提供了表单渲染方法。
{% from "bootstrap/wtf.html" import quick_form %}
和python语法类似。安装flask_bootstrap
时会有wtf.html
模板。
这里从wtf.html
模板中导入quick_form
方法。
- 然后,渲染表单就变得简单了(
hello.py
代码较4b版本没有改变,只在index.html
中修改了表单渲染方法。)。
- 表单功能没变,表单变得更好看,也不需要自己写那么多代码了。
最后,使用表单读取图片信息。
书上没有,不知道是不是视频太久远了。按照视频中的代码,总是报错,留在这里,和更复杂的表单一起学习。