Flask WTForm表单笔记

WTForm表单简介

　　在网页中，为了和用户进行信息交互总是不得不出现一些表单。flask设计了WTForm表单库来使flask可以更加简便地管理操作表单数据。WTForm中最重要的几个概念如下：

　　Form类，开发者自定义的表单必须继承自Form类或者其子类。Form类最主要的功能是通过其所包含的Field类提供对表单内数据的快捷访问方式。

　　各种Field类，即字段。一般而言每个Field类都对应一个input的HTML标签。比如WTForm自带的一些Field类比如BooleanField就对应<input type="checkbox">，SubmitField就对应<input type="submit">等等。

　　Validator类。这个类用于验证用户输入的数据的合法性。比如Length验证器可以用于验证输入数据的长度，FileAllowed验证上传文件的类型等等。

　　另外，flask为了防范csfr(cross-site request forgery)攻击，默认在使用flask-wtf之前要求app一定要设置过secret_key。最简单地可以通过app.config['SECRET_KEY'] = 'xxxx'来配置。app的配置涉及到如何架构整个项目目录，在以后再讲，这里默认这个SECRET_KEY已经配置完成。

 

表单类

一个自定义表单类的例子如下：

from flask.ext.wtf import Form
#新版本的flask中都会提示现在这种import方法已经过时，最新的import应该是from flask_wtf import Form
from wtforms import StringField,BooleanField,HiddenField,TextAreaField,DateTimeField
from wtforms.validators import FileAllowed,Required

class BaseForm(Form):
  id = HiddenField("id")

class BulletinForm(BaseForm):
  dt = DateTimeForm("发布时间",format="%Y-%m-%d %H:%M:%S")
  title = StringField("标题",validators=[Required()])
  content = TextAreaField("内容")
  valid = BooleanField("是否有效")
  source = StringField("来源")
  author = StringField("作者")
  image = FileField("图片上传",validators = [FileAllowed(['jpg','png'],'Images Only!')])

从上面这个例子中可以看到，BaseForm类其实是一些类的基类，它具有一些很多类都会具有的特征，所以被构造成基类让其他类型的表单再去继承它。

各种Field字段

除了上面提到的这些常用的Field之外，在wtforms中还有以下这些Field可供使用：

　　PasswordField　　密码字段，自动将输入转化为小黑点

　　DateField　　文本字段，格式要求为datetime.date一样

　　IntergerField　　文本字段，格式要求是整数

　　DecimalField　　文本字段，格式要求和decimal.Decimal一样

　　FloatField　　文本字段，值是浮点数

　　BooleanField　　复选框，值为True或者False

　　RadioField　　一组单选框

　　SelectField　　下拉列表，需要注意一下的是choices参数确定了下拉选项，但是和HTML中的<select> 标签一样，其是一个tuple组成的列表，可以认为每个tuple的第一项是选项的真正的值，而第二项是alias。

　　MultipleSelectField　　可选多个值的下拉列表

 

各种Validator

Validator是验证函数，把一个字段绑定某个验证函数之后，flask会在接收表单中的数据之前对数据做一个验证，如果验证成功才会接收数据。验证函数Validator如下，具体的validator可能需要的参数不太一样，这里只给出一些常用的，更多详细的用法可以参见wtforms/validators.py文件的源码，参看每一个validator类需要哪些参数：

　　*基本上每一个validator都有message参数，指出当输入数据不符合validator要求时显示什么信息。

　　Email　　验证电子邮件地址的合法性，要求正则模式是^.+@([^.@][^@]+)$

　　EqualTo　　比较两个字段的值，通常用于输入两次密码等场景，可写参数fieldname，不过注意其是一个字符串变量，指向同表单中的另一个字段的字段名

　　IPAddress　　验证IPv4地址，参数默认ipv4=True,ipv6=False。如果想要验证ipv6可以设置这两个参数反过来。

　　Length　　验证输入的字符串的长度，可以有min,max两个参数指出要设置的长度下限和上限,注意参数类型是字符串，不是INT!!

　　NumberRange　　验证输入数字是否在范围内，可以有min和max两个参数指出数字上限下限，注意参数类型是字符串，不是INT!!然后在这个validator的message参数里可以设置%(min)s和%(max)s两个格式化部分，来告诉前端这个范围到底是多少。其他validator也有这种类似的小技巧，可以参看源码。

　　Optional　　无输入值时跳过同字段的其他验证函数

　　Required　　必填字段

　　Regexp　　用正则表达式验证值，参数regex='正则模式'

　　URL　　验证URL，要求正则模式是^[a-z]+://(?P<host>[^/:]+)(?P<port>:[0-9]+)?(?P<path>\/.*)?$

　　AnyOf　　确保值在可选值列表中。参数是values（一个可选值的列表）。特别提下，和SelectField进行配合使用时，不知道为什么SelectField的choices中项的值不能是数字。。否则AnyOf的values参数中即使有相关数字也无法识别出当前选项是合法选项。我怀疑NoneOf可能也是一样的套路。

　　NoneOf　　确保值不在可选值列表中

此外再多说一句，在教材上和很多其他地方，基本上的路由模式都是把第一次进入表单的GET和提交表单数据时的POST的路径指向同一个。但是在我下面的那个实践当中，把POST单独分离于GET，放到了另一个路由下。这么做可以更加清晰的管理URL，但是会让validator失效。因为validator验证时验证的是POST路由下的表单对象，所以给出的反映也是给出到这个表单对象的，但是按照POST/GET分离的模式，必然要让POST的响应函数最后重定向到GET路由下，而在GET的响应函数中必然会重新创建一个表单对象，使得之前的validator失效了。

　　有意思的是flash消息并不受这种模式的影响。因为flash消息是通过后端把消息推入一个消息队列，然后前端拿去渲染，在POST上去后后端推入队列的flash消息并不立刻反映到POST路由下的表单对象，而当路由回到GET下，重新建立了表单对象然后渲染表单时，正好把flash消息给渲染出来了。

 

参考：

https://www.cnblogs.com/franknihao/p/7218425.html