使用 Flask 和 WTForms 构建一个用户注册表单

在这篇技术博客中，我们将使用 Flask 和 WTForms 库来构建一个用户注册表单。我们将创建一个简单的 Flask 应用，并使用 WTForms 定义一个注册表单，包括用户名、密码、确认密码、邮箱、性别、城市和爱好等字段。我们还将为表单添加验证规则，以确保用户输入的数据符合要求。

1. 安装 Flask 和 WTForms

首先，确保已经安装了 Flask 和 WTForms。如果没有安装，可以使用以下命令进行安装：

pip install Flask
pip install WTForms

2. 创建 Flask 应用

创建一个名为 app.py 的文件，并在其中编写以下代码：

from flask import Flask, render_template, request, redirect
from wtforms import Form
from wtforms.fields import core, simple, html5
from wtforms import validators
from wtforms import widgets
 
app = Flask(__name__, template_folder='templates')
app.debug = True

3. 定义注册表单

接下来，我们将定义一个名为 RegisterForm 的表单类，该类继承自 wtforms.Form。在这个类中，我们将定义各种字段和验证规则。

from flask import Flask, render_template, request, redirect
from wtforms import Form
from wtforms.fields import core, simple, html5
from wtforms import validators
from wtforms import widgets
 
 
app = Flask(__name__, template_folder='templates')
app.debug = True
 
 
class RegisterForm(Form):
    name = simple.StringField(
        label='用户名',
        validators=[
            validators.DataRequired()
        ],
        widget=widgets.TextInput(),
        render_kw={'class': 'form-control'},
        default='GuHanZhe'                         # 页面输入框默认值
    )
 
    pwd = simple.PasswordField(
        label='密码',
        validators=[
            validators.DataRequired(message='密码不能为空')
        ],
        widget=widgets.PasswordInput(),
        render_kw={'class': 'form-control'}
    )
 
    pwd_confirm = simple.PasswordField(
        label='确认密码',
        validators=[
            validators.DataRequired(message='确认密码不能为空'),
            validators.EqualTo('pwd', message='两次密码输入不一致')    # EqualTo作用是比较当前字段和指定字段名的字段值是否相等
        ],
        widget=widgets.PasswordInput(),
        render_kw={'class': 'form-control'}
    )
 
    email = html5.EmailField(
        label='邮箱',
        validators=[
            validators.DataRequired(message='邮箱不能为空'),
            validators.Email(message='邮箱格式有误')
        ],
        widget=widgets.TextInput(input_type='email'),
        render_kw={'class': 'form-control'}
    )
 
    gender = core.RadioField(
        label='性别',
        choices=(
            (1, '男'),
            (2, '女'),
        ),
        coerce=int
    )
 
    city = core.SelectField(
        label='城市',
        choices=(
            ('bj', '北京'),
            ('sh', '上海')
        )
    )
 
    hobby = core.SelectMultipleField(
        label='爱好',
        choices=(
            (1, '篮球'),
            (2, '足球')
        ),
        coerce=int
    )
 
    favor = core.SelectMultipleField(
        label='爱好',
        choices=(
            (1, '篮球'),
            (2, '足球')
        ),
        widget=widgets.ListWidget(prefix_label=False),
        option_widget=widgets.CheckboxInput(),
        coerce=int,
        default=[1, 2]
    )
 
    def __int__(self, *args, **kwargs):
        super(RegisterForm, self).__init__(*args, **kwargs)
        self.favor.choices = ((1, '篮球'), (2, '足球'), (3, '羽毛球'))
 
    def validate_pwd_confirm(self, field):
        """
        自定义pwd_confirm字段规则，例：与pwd字段是否一致
        """
        # 最开始初始化时，self.data中已有所有值
        if field.data != self.data['pwd']:
            # raise validators.ValidationError('密码不一致')   # 继续后续字段的验证
            raise validators.StopValidation('密码不一致')      # 不再继续后续字段的验证
 
 
@app.route('/register', methods=['GET', 'POST'])
def register():
    if request.method == 'GET':
        form = RegisterForm(data={'gender': 1})
        return render_template('register.html', form=form)
 
    form = RegisterForm(formdata=request.form)
    if form.validate():
        print('用户提交数据通过格式验证，提交的值为：', form.data)
    else:
        print(form.errors)
    return render_template('register.html', form=form)
 
 
if __name__ == '__main__':
    app.run()

4. 编写注册路由

现在，我们需要编写一个注册路由，该路由将处理用户的注册请求。当用户访问 /register 时，我们将渲染注册表单。当用户提交表单时，我们将验证表单数据，并在验证通过后打印提交的数据。

@app.route('/register', methods=['GET', 'POST'])
def register():
    if request.method == 'GET':
        form = RegisterForm(data={'gender': 1})
        return render_template('register.html', form=form)
 
    form = RegisterForm(formdata=request.form)
    if form.validate():
        print('用户提交数据通过格式验证，提交的值为：', form.data)
    else:
        print(form.errors)
    return render_template('register.html', form=form)

5. 创建注册表单模板

最后，我们需要创建一个名为 register.html 的模板文件，该文件将包含注册表单的 HTML 代码。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>注册表单</title>
</head>
<body>
    <h1>用户注册</h1>
    <form action="/register" method="post">
        <!-- ... 省略表单字段 ... -->
       <input type="submit" value="提交">
    </form>
</body>
</html>

6. 运行 Flask 应用

最后，我们需要在 app.py 文件中添加以下代码来运行 Flask 应用：

if __name__ == '__main__':
    app.run()

现在，你可以运行 app.py 文件，并在浏览器中访问 http://127.0.0.1:5000/register 来查看注册表单。当用户提交表单时，你将在控制台中看到提交的数据和验证结果。

这就是使用 Flask 和 WTForms 构建一个用户注册表单的过程。你可以根据自己的需求对表单进行进一步的定制和扩展。

civilpy：Python数据分析及可视化实例目录944 赞同 · 36 评论文章​编辑