FLASK表单
一、原生的表单
(1) 先添加一个login的模板 代码如下:
{% extends 'base.html' %} {% block title %} 登录 {% endblock %} {% block tcontent %} <h1>登录页面</h1> <form action="{{ url_for('check') }}" method="post"> <table> <tr> <td>用户名</td> <td><input type="text" name="username"></td> </tr> <tr> <td>密码</td> <td><input type="password" name="userpass"></td> </tr> <tr> <td><input type="submit" value="submit"></td> <td><input type="reset" value="reset"></td> </tr> </table> </form> {% endblock %} (2) 添加视图函数
#登录 @app.route('/login/') def login(): return render_template('login.html') #校验 #methods=['post','get'] 允许何种方式来提交 @app.route('/check/',methods=['get']) def check(): return '你提交过来了' (3) 视图传递 和 校验路由 合并为一
@app.route('/login/',methods=['post','get']) def login(): info = None if request.method == 'POST': userName = request.form.get('username') info = '欢迎%s'%userName return render_template('login.html',info=info) 模板更改为
{% if info %} {{ info }} {% endif %} {# <form action="{{ url_for('check') }}" method="post">#} <form method="post"> 如果表单的action属性为 空 或者没有action属性 则提交给当前地址
二、flask-wtf
(1) 说明：
是一个用于表单处理的扩展库 提供了csrf，表单校验等功能 使用方便
(2) 安装
pip install flask-wtf (3) 表单类 常用的字段类型
| 字段类型 | 字段说明 |
|---|---|
| StringField | 普通文本字段 |
| SubmitField | 提交按钮字段 |
| PasswordField | 密码字段 |
| HiddenField | 隐藏文本字段 |
| TextAreaField | 多行文本域字段 |
| DateField | 文本字段 datetime.date 格式 |
| DateTimeField | 文本字段 datetime.datetime 格式 |
| InterField | 文本字段 值为整数 |
| FloatField | 文本字段 值为浮点数 |
| BooleanField | 复选框 值为True 或者 Flase |
| RadioField | 单选框 |
| SelectField | 下拉框 |
| FileField | 文件上传 |
百度 字段类型 说 明 StringField 文本字段 TextAreaField 多行文本字段 PasswordField 密码文本字段 HiddenField 隐藏文本字段 DateField 文本字段，值为 datetime.date 格式 DateTimeField 文本字段，值为 datetime.datetime 格式 IntegerField 文本字段，值为整数 DecimalField 文本字段，值为 decimal.Decimal FloatField 文本字段，值为浮点数 BooleanField 复选框，值为 True 和 False RadioField 一组单选框 SelectField 下拉列表 SelectMultipleField 下拉列表，可选择多个值 FileField 文件上传字段 SubmitField 表单提交按钮 FormField 把表单作为字段嵌入另一个表单 FieldList 一组指定类型的字段 (4) 常见验证器类
| 验证器 | 说明 |
|---|---|
| DateRequired | 必填 required |
| 验证是否为邮箱 | |
| IPAddress | IP地址 |
| Length | 规定字符的长度 有min 和 max俩个选项 |
| NumberRange | 输入数值的范围 |
| EqualTo | 验证俩个字段值的 一致性 |
| URl | 验证是否为有效的url地址 |
| Regexp | 正则验证 |
验证函数 说 明 Email 验证电子邮件地址 EqualTo 比较两个字段的值；常用于要求输入两次密码进行确认的情况 IPAddress 验证 IPv4 网络地址 Length 验证输入字符串的长度 NumberRange 验证输入的值在数字范围内 Optional 无输入值时跳过其他验证函数 Required 确保字段中有数据 Regexp 使用正则表达式验证输入值 URL 验证 URL AnyOf 确保输入值在可选值列表中 NoneOf 确保输入值不在可选值列表中 (5) wtf的csrf
保护所有的表单 免受跨站请求攻击 为了实现 防止 跨站请求 需要设置一个秘钥 使用这个秘钥 再生成加密的令牌 用令牌去验证 数据的真伪
在manage.py文件中去设置秘钥
app = Flask(__name__) app.config['SECRET_KEY'] = '秘钥字符串' 在模板中使用
{{ form.hidden_tag() }} {{ form.csrf_token() }} 关闭csrf
def login(): form = LoginForm(csrf_enabled=False) #默认为True (6) 不适用bootstrap的表单
<form method="post"> <table> {{ form.hidden_tag() }} #csrf <tr> <td>{{ form.username.label() }}</td> #表单字段名 <td>{{ form.username(id='id名称',class='myClass',style='color:red;') }}</td> #表单标签 <td>{{ form.username.errors }}</td> #提交 </tr> <tr> <td>{{ form.submit() }}</td> </tr> </table> </form> (7) 使用bootstrap快速生成的
{% extends 'base.html' %} {% block title %} 登录 {% endblock %} {% import 'bootstrap/wtf.html' as wtf %} #导入boot的wtf表单文件 {% block tcontent %} {{ wtf.quick_form(form) }} #快速生成表单 #常用关键字参数 action = '提交地址' method = '提交类型' enctype = '提交方式' {{ wtf.quick_form(form，action='',method='',enctype='') }} #快速生成表单 {{ wtf.quick_form(form,action = url_for('login')) }} {% endblock %} (8) 对应的视图
class LoginForm(FlaskForm): username = StringField('用户名',validators=[DataRequired(message='不能为空')],id='newName') submit = SubmitField('提交') @app.route('/login/',methods=['post','get']) def login(): form = LoginForm() #验证是否 是一个有效的提交的表单 如果不是 则会输出错误信息 if form.validate_on_submit(): print(form.username.data) return render_template('boot_login.html', form=form) (9) 自定义 字段验证(在使用的时候 正常)
class LoginForm(FlaskForm): #系统验证 username = StringField('用户名',validators=[DataRequired(message='不能为空'),Length(min=4,max=6,message='请输入正确的值')]) submit = SubmitField('提交') #自定义字段验证 # def validate_属性名(self,field) def validate_username(self,field): if len(field.data)<5: raise ValidationError('用户名不能小于5个长度') ![TestLink导出用例转换工具(XML2Excel)[图]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)