表单验证(WTF)

2024-09-07 17:58
文章标签 表单 验证 wtf

本文主要是介绍表单验证(WTF),希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

官方文档
在Flask项目开发中针对提交表单的校验,可以使用Flask-WTF扩展库进行快速的字段校验,也可以进行页面快速渲染,并提供跨站请求伪造的保护功能。

安装Flask-WTF

pip install flask-wtf

实现注册功能

注册表单模型定义

在定义的表单类中定义需要验证的username、password和password2字段,并实现如下校验:
校验密码password2和password相等
校验用户名是否存在
校验用户名的长度是否符合规范

 # 导入扩展类from flask_wtf import FlaskForm# 导入验证字段from wtforms import StringField, SubmitField, ValidationError# 导入表单验证from wtforms.validators import DataRequired, EqualTofrom user.models import Userclass UserRegisterForm(FlaskForm):"""登录注册表单验证"""username = StringField('用户名', validators=[DataRequired()])password = StringField('密码', validators=[DataRequired()])password2 = StringField('确认密码', validators=[DataRequired(),EqualTo('password', '密码不一致')])submit = SubmitField('注册')def validate_username(self, field):# 验证用户名是否重复if User.query.filter(User.username == field.data).first():raise ValidationError('用户名已存在')# 对用户名的长度进行判断if len(field.data) < 3:raise ValidationError('用户名长度不能少于3个字符')if len(field.data) > 6:raise ValidationError('用户名长度不能大于6个字符')

注意: 验证字段的方法名为: validate_字段(self, field)

定义注册视图函数
当HTTP请求为GET时,将表单验证对象返回给页面。
当HTTP请求为POST时,通过方法validate_on_submit()方法进行字段校验和提交判断,如果校验失败,则可以从form.errors中获取错误信息。
如果验证通过,则从form.字段.data中获取到字段的值。

@user_blueprint.route('/register/', methods=['GET', 'POST'])
def register():form = UserRegisterForm()if request.method == 'GET':return render_template('register.html',form=form)if request.method == 'POST':# 验证提交的字段信息if form.validate():username = form.username.datapassword = form.password.data# 实现注册,保存用户信息到User模型中user = User()user.username = usernameuser.password = generate_password_hash(password)user.save()return redirect(url_for('user.login'))        # 验证失败,from.errors中存在错误信息return render_template('register.html',form=form)

模板展示

注册模板采用继承父模板base.html的形式。在register.html模压中分析如下:

  1. 定义字段名: {{ form.字段.label }}
  2. 定义input输入框: {{ form.字段 }}
  3. 展示错误信息: {{ form.errors.字段 }}
  4. 跨站请求伪造: {{ form.csrf_token }}
    注册register.html页面如下:
{% extends 'base.html' %}{% block content %}<form action="" method="post">{{ form.csrf_token }}{{ form.username.label }} : {{ form.username }}{% if form.errors %}{{ form.errors.password2[0] }}{% endif %}<br>{{ form.password.label }} : {{ form.password }}<br>{{ form.password2.label }} : {{ form.password2 }}{% if form.errors %}{{ form.errors.password2[0] }}{% endif %}<br>{{ form.submit() }}</form>{% endblock %}

注意: 通过form.字段解析的input标签中可以自定义样式,如{{ form.字段(class='xxx', style='color:red') }}

常见字段类型

字段类型说明
StringField普通文本字段
PasswordField密码文本字段
SubmitField提交按钮
HiddenField隐藏文本字段
TextAreaField多行文本字段
DateField文本字段,datetime.date格式
DateTimeField文本字段,datetime.datetime格式
IntegerField文本字段,整数类型
FloatField文本字段,小数类型
BooleanField复选框,值为True或False
RadioField单选框
SelectField下拉列表
FileField文件上传字段

验证器

验证器说明
DataRequired确保字段有值(并且if判断为真)
Email邮箱地址
IPAddressIPv4的IP地址
Length规定字符长度
NumberRange输入数值的范围
EqualTo验证两个字段的一致性
URL有效的URL
Regexp正则验证

 

这篇关于表单验证(WTF)的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1145753

相关文章

Spring Security基于数据库验证流程详解

Spring Security 校验流程图 相关解释说明(认真看哦) AbstractAuthenticationProcessingFilter 抽象类 /*** 调用 #requiresAuthentication(HttpServletRequest, HttpServletResponse) 决定是否需要进行验证操作。* 如果需要验证,则会调用 #attemptAuthentica

C++ | Leetcode C++题解之第393题UTF-8编码验证

题目: 题解: class Solution {public:static const int MASK1 = 1 << 7;static const int MASK2 = (1 << 7) + (1 << 6);bool isValid(int num) {return (num & MASK2) == MASK1;}int getBytes(int num) {if ((num &

HTML提交表单给python

python 代码 from flask import Flask, request, render_template, redirect, url_forapp = Flask(__name__)@app.route('/')def form():# 渲染表单页面return render_template('./index.html')@app.route('/submit_form',

C语言 | Leetcode C语言题解之第393题UTF-8编码验证

题目: 题解: static const int MASK1 = 1 << 7;static const int MASK2 = (1 << 7) + (1 << 6);bool isValid(int num) {return (num & MASK2) == MASK1;}int getBytes(int num) {if ((num & MASK1) == 0) {return

easyui同时验证账户格式和ajax是否存在

accountName: {validator: function (value, param) {if (!/^[a-zA-Z][a-zA-Z0-9_]{3,15}$/i.test(value)) {$.fn.validatebox.defaults.rules.accountName.message = '账户名称不合法(字母开头,允许4-16字节,允许字母数字下划线)';return fal

easyui 验证下拉菜单select

validatebox.js中添加以下方法: selectRequired: {validator: function (value) {if (value == "" || value.indexOf('请选择') >= 0 || value.indexOf('全部') >= 0) {return false;}else {return true;}},message: '该下拉框为必选项'}

form表单提交编码的问题

浏览器在form提交后,会生成一个HTTP的头部信息"content-type",标准规定其形式为Content-type: application/x-www-form-urlencoded; charset=UTF-8        那么我们如果需要修改编码,不使用默认的,那么可以如下这样操作修改编码,来满足需求: hmtl代码:   <meta http-equiv="Conte

js异步提交form表单的解决方案

1.定义异步提交表单的方法 (通用方法) /*** 异步提交form表单* @param options {form:form表单元素,success:执行成功后处理函数}* <span style="color:#ff0000;"><strong>@注意 后台接收参数要解码否则中文会导致乱码 如:URLDecoder.decode(param,"UTF-8")</strong></span>

前端form表单+ifarme方式实现大文件下载

// main.jsimport Vue from 'vue';import App from './App.vue';import { downloadTokenFile } from '@/path/to/your/function'; // 替换为您的函数路径// 将 downloadTokenFile 添加到 Vue 原型上Vue.prototype.$downloadTokenF

web群集--nginx配置文件location匹配符的优先级顺序详解及验证

文章目录 前言优先级顺序优先级顺序(详解)1. 精确匹配(Exact Match)2. 正则表达式匹配(Regex Match)3. 前缀匹配(Prefix Match) 匹配规则的综合应用验证优先级 前言 location的作用 在 NGINX 中,location 指令用于定义如何处理特定的请求 URI。由于网站往往需要不同的处理方式来适应各种请求,NGINX 提供了多种匹