bootstrap的表单验证 vue_第45天：Web表单

在了解了 Flask Bootstrap 基本框架之后，我们来了解一下 Flask 框架的 表单( form )，以帮助我们创建交互式的 Web 应用，最后会有个提交个人信息的例子。

Flask-WTF 是 Flask 框架的一个扩展，用来做表单的交互，是对 WTForms 的集成，默认支持 CSRF 安全签名，并且继承文件上传功能。

安装

使用 pip 安装

pip install Flask-WTF

验证

>>> from flask_wtf import FlaskForm>>>

小试牛刀

创建表单类

Flask-WTF 能将 WTForms 集成到 Flask 应用中，创建一个 app.py 主代码文件，例如：

from flask_wtf import FlaskFormfrom wtforms import StringFieldfrom wtforms.validators import DataRequiredclass MyForm(FlaskForm):    name = StringField('name', validators=[DataRequired()])

MyForm 是自定义的类，继承自 FlaskForm，其中定义了一个字段 name，标题是 name, 且设置为非空。

表单模板

接下来创建一个表单模板 submit.html，例如:

    {
    { form.csrf_token }}    {
    { form.name.label }} {
    { form.name(size=20) }}    

其中 form.csrf_token 是 Flask-WTF 提供的一个防止跨站请求伪造的隐藏字段。原理是将一个密钥根据请求特征加密，在表单提交时一起送到服务器端，作校验。

密钥串与多种定义方式，为了方便，这里将密钥串定义在应用上:

app.secret_key = 'abc'

注意：上示例仅作演示说明，不能在生产系统中用这样简单的密钥

之后则是对字段 name 的模板定义，经过渲染会替换成 Html 控件。

定义视图函数

视图函数首先需要将表单渲染出来，另外要对表单的提交作验证，当然视图函数与提交验证函数也可不是同一个：

@app.route('/', methods=('GET', 'POST'))def subm