使用Python的Flask框架表单插件Flask-WTF实现Web登录验证

下面是使用Python的Flask框架表单插件Flask-WTF实现Web登录验证的完整攻略，包括两个示例说明。

整体思路

在Flask Web应用中，Web登录验证功能需要通过表单实现。Flask-WTF就是一个用于创建Web表单的框架，它可以大大简化表单处理的流程。在使用Flask-WTF创建表单时，我们需要做以下几个步骤：

创建Web表单，定义表单字段及验证规则。
在Flask应用中引入Flask-WTF模块，并创建Flask-WTF表单对象。
在Flask应用中定义路由处理函数，让用户可以访问到Web表单，并通过POST请求提交表单数据。
在路由处理函数中，验证用户提交的数据，如果数据合法，则给用户一个成功的反馈；如果不合法，则返回一个错误信息。

示例一：使用Flask-WTF实现基本的Web登录验证

下面是使用Flask-WTF实现基本Web登录验证的代码示例：

1. 安装Flask-WTF

在命令行中输入以下命令：

pip install Flask-WTF

2. 创建Web表单类

在Python文件中引入Flask-WTF模块，并定义一个Web表单类，用于实现用户登录功能。代码如下：

from flask_wtf import FlaskForm
from wtforms import StringField, PasswordField, SubmitField, validators

class LoginForm(FlaskForm):
    username = StringField('Username', validators=[validators.DataRequired(), validators.Length(min=4, max=20)])
    password = PasswordField('Password', validators=[validators.DataRequired(), validators.Length(min=6, max=20)])
    submit = SubmitField('Sign In')

在上面的代码中，我们定义了一个Web表单类LoginForm，它包含三个字段：username、password和submit。其中，username和password都是字符串字段，分别用于输入用户名和密码；而submit则是一个提交按钮，用户可以通过它提交表单数据。

在这个Web表单类中，我们还使用了Flask-WTF提供的validators模块，用于添加验证规则。在username和password字段中，我们分别添加了两个验证规则：DataRequired和Length。其中，DataRequired用于验证字段是否非空；而Length则用于验证字段的长度范围是否合法。

3. 创建Flask-WTF表单对象

在Flask应用中创建Flask-WTF表单对象，并设置安全密钥。代码如下：

from flask_wtf import CSRFProtect

app = Flask(__name__)
app.config['SECRET_KEY'] = 'secret key'
csrf = CSRFProtect(app)

在上面的代码中，我们首先创建了一个Flask应用对象app。然后，我们调用csrf = CSRFProtect(app)进行Flask-WTF初始化操作，用于防范跨站点请求伪造攻击。最后，我们设置了一个安全密钥SECRET_KEY，用于加密表单数据。

4. 在Flask应用中定义路由处理函数

在Flask应用中定义一个路由处理函数，用于处理用户提交的登录表单数据。代码如下：

@app.route('/login', methods=['GET', 'POST'])
def login():
    form = LoginForm()
    if form.validate_on_submit():
        # 验证表单通过，跳转到首页
        return redirect('/')
    # 验证表单未通过，重新显示表单
    return render_template('login.html', form=form)

在上面的代码中，我们首先创建了一个LoginForm对象，然后通过validate_on_submit()方法验证表单数据是否合法。如果合法，则跳转到首页；否则，则重新显示登录表单，并提示用户输入正确数据。

5. 在HTML模板中渲染Web表单

创建一个HTML模板login.html，用于显示Web表单界面。代码如下：

{% extends 'base.html' %}

{% block content %}
  <h2>Sign In</h2>
  <form method="POST" action="{{ url_for('login') }}">
      {{ form.csrf_token }}
      <div class="form-group">
          {{ form.username.label }} {{ form.username(size=30) }}
          {% for error in form.username.errors %}
              <span class="error">{{ error }}</span>
          {% endfor %}
      </div>
      <div class="form-group">
          {{ form.password.label }} {{ form.password(size=30) }}
          {% for error in form.password.errors %}
              <span class="error">{{ error }}</span>
          {% endfor %}
      </div>
      {{ form.submit }}
  </form>
{% endblock %}

在上面的代码中，我们首先继承了一个基础模板base.html。然后，使用Flask提供的url_for()函数，为表单提交指定路由处理函数。最后，我们通过Flask-WTF提供的{{ form.xxxxx }}方式，在HTML中渲染了表单输入框、标签和按钮等元素。

示例二：使用Flask-WTF实现附加输入框的Web表单

下面是使用Flask-WTF实现附加输入框的Web表单代码示例。

1. 创建Web表单类

在Python文件中引入Flask-WTF模块，并定义一个Web表单类，用于实现一个带附加输入框的表单。代码如下：

from flask_wtf import FlaskForm
from wtforms import StringField, PasswordField, SubmitField, validators

class ExtraFieldForm(FlaskForm):
    username = StringField('Username', validators=[validators.DataRequired(), validators.Length(min=4, max=20)])
    password = PasswordField('Password', validators=[validators.DataRequired(), validators.Length(min=6, max=20)])
    extra = StringField('Extra Field', validators=[validators.Optional(), validators.Length(max=30)])
    submit = SubmitField('Sign In')

在上面的代码中，与示例一不同的是，我们增加了一个名为extra的字符串输入框，用户可以在上面输入额外的信息。同时，我们添加了一个Optional规则，表示这个输入框是可选的。

2. 创建Flask-WTF表单对象

在Flask应用中创建Flask-WTF表单对象，并设置安全密钥。代码如下：

from flask_wtf import CSRFProtect

app = Flask(__name__)
app.config['SECRET_KEY'] = 'secret key'
csrf = CSRFProtect(app)

同样地，我们设置了安全密钥，用于给表单数据进行加密。

3. 在Flask应用中定义路由处理函数

在Flask应用中定义一个路由处理函数，用于处理用户提交的表单数据。代码如下：

@app.route('/extra-field', methods=['GET', 'POST'])
def extra_field():
    form = ExtraFieldForm()
    if form.validate_on_submit():
        # 验证表单通过，跳转到首页
        return redirect('/')
    # 验证表单未通过，重新显示表单
    return render_template('extra_field.html', form=form)

在上面的代码中，我们同样创建了一个Flask对象并引入了Flask-WTF模块，并定义一个路由处理函数extra_field()。在这个函数的实现中，我们首先创建了一个ExtraFieldForm对象，并通过validate_on_submit()方法验证用户输入数据是否合法。如果合法，则跳转到首页；否则，则重新显示附加输入框的表单。

4. 在HTML模板中渲染Web表单

创建一个HTML模板extra_field.html，用于显示带附加输入框的Web表单界面。代码如下：

{% extends 'base.html' %}

{% block content %}
  <h2>Extra Field</h2>
  <form method="POST" action="{{ url_for('extra_field') }}">
      {{ form.csrf_token }}
      <div class="form-group">
          {{ form.username.label }} {{ form.username(size=30) }}
          {% for error in form.username.errors %}
              <span class="error">{{ error }}</span>
          {% endfor %}
      </div>
      <div class="form-group">
          {{ form.password.label }} {{ form.password(size=30) }}
          {% for error in form.password.errors %}
              <span class="error">{{ error }}</span>
          {% endfor %}
      </div>
      <div class="form-group">
          {{ form.extra.label }} {{ form.extra(size=30) }}
          {% for error in form.extra.errors %}
              <span class="error">{{ error }}</span>
          {% endfor %}
      </div>
      {{ form.submit }}
  </form>
{% endblock %}

通过上述两个示例，我们可以看到：使用Python的Flask框架表单插件Flask-WTF实现Web登录验证相对来说是比较简单的。只需要先创建Web表单类，然后创建Flask-WTF表单对象，最后通过定义路由处理函数，在HTML中呈现即可。而且，在表单验证方面，Flask-WTF也提供了比较完善的验证规则，可以满足大多数Web应用的要求。因此，Flask-WTF是一个值得推荐的Python表单框架。

本站文章如无特殊说明，均为本站原创，如若转载，请注明出处：使用Python的Flask框架表单插件Flask-WTF实现Web登录验证 - Python技术站