欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识！
您现在的位置是： 首页

Flask学习日志（三）

程序员文章站 2022-06-11 21:35:35
...

今天学习新的内容了

Flask学习日志-表单

1、Web表单

1.1 简单了解
Q1：什么是Web表单？
  • 一个web应用程序的基础功能
  • HTML页面中负责数据采集的部件
Q2：表单有哪些组成部分？
  • 表单标签
  • 表单域
  • 表单按钮
Q3：表单干了什么工作？
  • 允许用户输入数据
  • 负责HTML页面数据采集
  • 将用户的数据提交给服务器
1.2 普通表单实现与验证

就以看房子为例，现在我房子用的是密码锁，进房子之前需要填写信息，先说一下逻辑：

  1. 首先路由需要两种请求方式，get和post，我们要从页面输入参数就需要用post，而从表单中获取参数就要用get
  2. 获取请求的参数
  3. 就是判断逻辑了，看你有没有填写完整密码，或者密码错误
  4. 对于不同的问题，作出相应的回应

这里我们先写一个表单，里面有户主名和房间密码。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Form</title>
</head>
<body>
<form method="post">
    <label>户主名：</label><input type="text" name="username"><br>
    <label>房间密码：</label><input type="password" name="password"><br>
    <label>确认密码：</label><input type="password" name="password2"><br>
    <input type="submit" value="确认"><br>
</form>
</body>
</html>

效果如下：
Flask学习日志（三）
具体实现代码如下：
这里要获取请求数据就要用到request

@app.route('/',methods=['GET','POST'])
def form():
	#request 是一个请求对象 可以获取请求方式、数据
	if request.method=='POST':
		#获取请求参数
		username=request.form.get('username')
		pwd = request.form.get('password')
		pwd2 = request.form.get('password2')
		#验证逻辑
		if not all([username,pwd,pwd2]):
			print("Incomplete data!")
		elif pwd!=pwd2:
			print('Password error!')
		else:
			return username+'! Welcome home!'
	return render_template('userform.html')
if __name__=='__main__':
	app.run(debug=True)
1.3 flash消息闪现

在之前我们对于表单数据问题的回应是在控制台显示的，现在我们要让它在网页上显示，所以我们要用flash动态显示。

  • 只需要把print改为flash即可。
		if not all([username,pwd,pwd2]):
			flash("Incomplete data!")
		elif pwd!=pwd2:
			flash('Password error!')

同时要注意在使用flash时要加密消息，要设置好secret_key

app.secret_key='Ethan312'

然后呢，我们在模板里遍历一下flash消息列表，get_flashed_messages()返回的是一个列表

{% for message in get_flashed_messages() %}
        {{ message }}
    {% endfor %}

来看看效果吧！
Flask学习日志（三）
Flask学习日志（三）
现在，消息直接在网页上显示了

2、WTF扩展

2.1 WTF简单了解

在Flask中，为了处理web表单，一般使用Flask-WTF扩展，它封装了WTForms，并且有验证表单数据的功能。

我们用它来验证表单，它有许多验证函数，具体可以看它的flask_WTF阅读文档
先来看一下WTForms支持的HTML标准字段：

字段对象 说明
StringField 文本字段
TextAreaField 多行文本字段
PasswordField 密码文本字段
HiddenField 隐藏文件字段
DateField 文本字段，值为datetime.date文本格式
DateTimeField 文本字段，值为datetime.datetime 文本格式
IntegerField 文本字段，值为整数
DecimalField 文本字段，值为decimal.Decimal
FloatField 文本字段，值为浮点数
BooleanField 复选框，值为True 和False
RadioField 一组单选框
SelectField 下拉列表
SelectMutipleField 下拉列表，多选
FileField 文件上传字段
SubmitField 表单提交按钮
FormField 把表单作为字段嵌入另一个表单
FieldList 一组指定类型的字段

WTForms常用验证函数

验证函数 说明
DataRequired 确保字段中有数据
EqualTo 比较两个字段的值，常用于比较两次密码输入
Length 验证输入字符串长度
NumberRange 验证输入的值在数字范围内
URL 验证URL
AnyOf 验证输入值在可选列表内
NoneOf 验证输入值不在可选列表内
2.2 WTF表单显示
  1. 在py文件中自定义一个表单类，继承自FlaskForm
from flask_wtf import FlaskForm
from wtforms import StringField,PasswordField,SubmitField
class UserForm(FlaskForm):
	username=StringField('户主名：')
	password = PasswordField('房间密码：')
	password2 = PasswordField('确认密码：')
	submit = SubmitField('确认')
  1. 在视图函数中创建一个表单类对象，并将对象传入
@app.route('/form',methods=['GET','POST'])
def login_form():
	user_form=UserForm()
	return render_template('userform.html',form=user_form)
  1. 在HTML页面直接写form表单
<form method="post">
    <h3>WTF表单显示</h3>
    {{ form.username.label}}{{ form.username }}<br>
    {{ form.password.label}}{{form.password }}<br>
    {{ form.password2.label}}{{form.password2 }}<br>
    {{ form.submit }}
</form>

效果如下：
Flask学习日志（三）

2.3 WTF表单验证
  1. 导入需要的验证函数
from wtforms.validators import DataRequired,EqualTo
  1. 给表单类的函数中传入验证函数
username=StringField('户主名：',validators=[DataRequired()])
	password = PasswordField('房间密码：', validators=[DataRequired()])
	password2 = PasswordField('确认密码：', validators=[DataRequired(),EqualTo('password','Password error！')])
	submit = SubmitField('确认')

validators可以传入多个参数，这里EqualTo()函数中，传入的第一个参数是你要对比的值，第二个是message，就是当密码不一样时，会提示消息message。

  1. 判断请求方式，并获取参数
	if request.method=='POST':
		#获取请求参数
		username=request.form.get('username')
		pwd = request.form.get('password')
		pwd2 = request.form.get('password2')
  1. 验证参数
		if user_form.validate_on_submit():
			return username+'! Welcome home!'
		else:
			flash('Data error!')

效果如下：
Case1：空白字符
Flask学习日志（三）
Case2：密码不一致
Flask学习日志（三）
Case3：信息一致
Flask学习日志（三）
??? 怎么回事？
先调试一下
Flask学习日志（三）
error：The CSRF token is missing.
什么是CSRF？

使用Flask-WTF需要设置参数SECRET_KEY
CSRF_ENABLED是为了CSRF（跨站请求伪造）保护。SECRET_KEY用来生成加密令牌，当CSRF**，该设置会根据设置的**生成加密令牌。

如何解决呢？
只要在HTML页面的form表单里添加这句就可以了

 {{ form.csrf_token() }}

现在来试一下
Flask学习日志（三）
成功了！终于可以进房子了！

3、总结

一句话 ！今天主要是学习了web表单的显示与验证！
一种：普通的显示与验证
另一种：WTF扩展

相关标签： 学习 python web flask

上一篇： Java初学——项目三之开发团队调度软件

下一篇： mysql -参数thread_cache_size优化方法 小结

推荐阅读