在这里插入图片描述

使用 Flask + WTForms=》Web Toolkit Forms

在这里插入图片描述

from flask import Flask, render_template, request
from wtforms import Form, StringField, validators
# from wtforms.validators import Length, DataRequired
app = Flask(__name__)

# 1. 定义表单类
class RegistrationForm(Form):
    username = StringField('用户名', [
        validators.Length(min=4, max=25, message='长度需在4-25之间'),
        validators.DataRequired(message='用户名不能为空')
    ])
    # =========上面也可以写成这样=========
		username = StringField('用户名', validators=[
		Length(min=4, max=25, message='长度需在4-25之间'), 
		DataRequired(message='用户名不能为空')
		   ])
	 #============================================
    email = StringField('邮箱', [
        validators.Email(message='请输入有效的邮箱地址'),
        validators.DataRequired(message='邮箱不能为空')
    ])

@app.route('/register', methods=['GET', 'POST'])
def register():
    form = RegistrationForm(request.form)  # 2. 手动绑定请求数据
    if request.method == 'POST' and form.validate():  # 3. 手动验证
        # 4. 验证通过,获取数据
        username = form.username.data
        email = form.email.data
        return f'用户 {username} 注册成功!'
    
    # 5. 渲染表单和错误信息
    return render_template('register.html', form=form)

#  register.html
{{ form.CSRF_token()}}  from wtforms import Form,不支持 这种,  from flask_wtf import FlaskForm  # 导入 FlaskForm这种才可以
<!-- 步骤1:渲染 label -->
{{ form.username.label(class="form-label") }}<label for="username" class="form-label">用户名</label>

<!-- 步骤2:渲染 input -->
{{ form.username(class="form-control", placeholder="请输入用户名", autofocus=true) }}<input type="text" id="username" name="username" 
         class="form-control" 
         placeholder="请输入用户名" 
         autofocus="true">

<!-- 步骤3:如果有错误(假设提交空表单) -->
{% if form.username.errors %}
  <ul class="errors">
    <li class="error-msg">长度需在4-25之间</li>
    <li class="error-msg">用户名不能为空</li>
  </ul>
{% endif %}

》》Wtforms 支持的字段类型
在这里插入图片描述
》》WTForms 支持的表单验证函数
在这里插入图片描述

from wtforms import Form VS from flask_wtf import FlaskForm

在这里插入图片描述
在这里插入图片描述

## 使用原生 wtforms.Form
from flask import Flask, request, render_template, redirect, url_for
from wtforms import Form, StringField, PasswordField, SubmitField
from wtforms.validators import DataRequired, Length

app = Flask(__name__)

# 定义表单类 - 继承自 wtforms.Form
class LoginForm(Form):
    username = StringField('用户名', validators=[DataRequired(), Length(min=3, max=20)])
    password = PasswordField('密码', validators=[DataRequired(), Length(min=6, max=20)])
    submit = SubmitField('登录')

@app.route('/login', methods=['GET', 'POST'])
def login():
    # 手动将 request 数据传入表单
    form = LoginForm(request.form)
    
    if request.method == 'POST' and form.validate():
        # 验证通过后的处理
        return f'欢迎,{form.username.data}!'
    
    return render_template('login_form.html', form=form)
################使用 flask_wtf.FlaskForm(推荐)#######################
from flask import Flask, render_template, redirect, url_for, flash
from flask_wtf import FlaskForm          # 注意导入路径
from wtforms import StringField, PasswordField, SubmitField
from wtforms.validators import DataRequired, Length

app = Flask(__name__)
app.config['SECRET_KEY'] = 'your-secret-key'   # FlaskForm 需要 secret key 用于 CSRF

# 定义表单类 - 继承自 FlaskForm
class LoginForm(FlaskForm):
    username = StringField('用户名', validators=[DataRequired(), Length(min=3, max=20)])
    password = PasswordField('密码', validators=[DataRequired(), Length(min=6, max=20)])
    submit = SubmitField('登录')

@app.route('/login', methods=['GET', 'POST'])
def login():
    form = LoginForm()          # 无需传入 request,自动处理
    
    if form.validate_on_submit():   # 一步完成:POST 请求 + 验证
        # 验证通过后的处理
        return f'欢迎,{form.username.data}!'
    
    return render_template('login_flask.html', form=form)

<!-- templates/login_flask.html(FlaskForm 专用) -->
对于原生 Form,模板中不需要 {{ form.hidden_tag() }}(因为没有 CSRF 保护),但也可以手动添加隐藏字段。
<form method="POST">
    {{ form.hidden_tag() }}   <!-- 必须添加!自动渲染 CSRF 令牌 -->
    {{ form.username.label }} {{ form.username(size=20) }}<br>
    {{ form.password.label }} {{ form.password(size=20) }}<br>
    {{ form.submit() }}
</form>

在这里插入图片描述

Fast API


## 使用 FastAPI + Pydantic
```python
from fastapi import FastAPI
from pydantic import BaseModel, EmailStr, Field

app = FastAPI()

# 1. 定义数据模型
class UserRegistration(BaseModel):
    username: str = Field(..., min_length=4, max_length=25, description='用户名')
    email: EmailStr = Field(..., description='邮箱地址')

# 2. 在路径操作函数中直接声明模型类型
@app.post('/register')
async def register(user: UserRegistration):  # FastAPI 自动完成绑定、解析和验证
    # 3. 验证通过,直接使用
    return {'message': f'用户 {user.username} 注册成功!'}

在这里插入图片描述

Logo

腾讯云面向开发者汇聚海量精品云计算使用和开发经验,营造开放的云计算技术生态圈。

更多推荐