1. flask-wtf表单介绍
集成 wtforms
CSRF保护(恶意网站把请求发送到被攻击者已登录的其他网站时就会引发CSRF 攻击。为了实现CSRF 保护,Flask-WTF 需要程序设置一个密钥)
与 Flask-Uploads 一起支持文件上传
配置(CSRF保护):WTF_CSRF_SECRET_KEY = 'a random string'
2. 第一个表单模型
使用Flask-WTF 时,每个Web 表单都由一个继承自Form 的类表示。这个类定义表单中的一组字段,每个字段都用对象表示。字段对象可附属一个或多个验证函数。
3. 表单常用字段类型及渲染
表单字段的常用核心参数:
label——label标签(如:输入框前的文字描述)
default——表单的默认值
validators——表单验证规则
widget——定制界面显示方式(如:文本框、选择框)
description——帮助文字
表单常用字段类型:
文本/字符串:
StringField——字符串输入
PasswordField——密码输入
TextAreaField——长文本输入
HiddenField——隐藏表单域
数值(整数,小数):
FloatField——浮点数输入
IntegerField——整数输入
DecimalField——小数输入(更精确)
选择:
RadioField——radio单选
SelectField——下拉单选
SelectMultipleField——下拉多选
BooleanField——勾选(复选框)
日期/时间:
DateField——日期选择
DateTimeField——日期时间选择
文件/文件上传:
FileField——文件单选
MultipleFileField——文件多选
其他:
SubmitField——提交按钮
FieldList——自定义的表单选择列表(如:选择用户对象)
FormField——自定义多个字段构成的选项
使用模板语法渲染表单内容:
表单输入区域:{{ form.username }}
表单label:{{ form.username.label.text }}
通过表单保存数据:
第一步:检测表单是否已经通过验证
form.validate_on_submit()
第二步:获取表单中传递过来的值
form.field_name.data
第三步:业务逻辑代码编写(可结合ORM)
4. CSRF表单保护
默认开启CSRF保护
关闭单个表单CSRF保护
form = LoginForm(csrf_enabled=False)
全局关闭(不推荐)
WTF_CSRF_ENABLED = False
同步请求CSRF保护:
模板中添加csrf_token
{{ form.csrf_token }}
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}" />
异步请求(AJAX)CSRF保护:
第一步:模板中添加csrf_token
<meta name="csrf-token" content="{{ csrf_token() }}">
<script type="text/javascript">
var csrftoken = "{{ csrf_token() }}"
</script>
第二步:添加 X-CSRFToken 头
5. 表单验证
步骤1:导入内置的表单验证器(或自定义)
from wtforms.validators import DataRequired
步骤2:配置到表单字段
username = StringField('用户名', validators=[InputRequired(), my_validator])
内置表单验证器:
DataRequired/ InputRequired——必填
Email/ URL/UUID——电子邮箱/URL/UUID
Length(min=-1, max=-1, message=None)长度范围验证
EqualTo(fieldname, message=None)两个字段输入的值相等(如:密码确认)
Optional 无输入值时跳过其他验证函数
Regexp 使用正则表达式验证输入值
自定义表单验证:
6. 图片上传
两种方式实现文件上传
方式一:不使用wtf实现
方式二:使用FileField并添加类型验证
文件名称格式化
werkzeug.utils.secure_filename
不使用wtf:
第一步:设置<form>的enctype
enctype="multipart/form-data"
第二步:在视图函数中获取文件对象
request.files
第三步:保存文件
f.save(file_path)
图片上传验证:
FileRequired:文件必须上传验证
FileAllowed:文件类型验证
使用扩展: Flask-Uploads
常用文件类型验证
指定文件上传的目录