3.5 フォームの処理 #

ウェブアプリケーションでは、ユーザーからの入力を受け付けるためにフォームがよく使われます。この記事では、Flaskでフォームを処理する方法について解説します。

1. WTFormsのインストール #

Flaskでフォームを簡単に扱うために、WTFormsというライブラリを使用します。まずは、WTFormsをインストールしましょう。

$ pip install WTForms

2. フォームクラスの定義 #

WTFormsを使って、フォームの構造を定義するフォームクラスを作成します。例として、ユーザー登録用のフォームを定義してみましょう。フォームクラスは以下のように作成します。

from wtforms import Form, StringField, PasswordField, validators

class RegistrationForm(Form):
    username = StringField('Username', [
        validators.Length(min=4, max=25, message='Username must be between 4 and 25 characters long'),
        validators.InputRequired(message='Username is required')
    ])
    email = StringField('Email', [
        validators.Length(min=6, max=50, message='Email must be between 6 and 50 characters long'),
        validators.Email(message='Invalid email address'),
        validators.InputRequired(message='Email is required')
    ])
    password = PasswordField('Password', [
        validators.Length(min=8, message='Password must be at least 8 characters long'),
        validators.InputRequired(message='Password is required'),
        validators.EqualTo('confirm', message='Passwords must match')
    ])
    confirm = PasswordField('Confirm Password')

この例では、RegistrationFormというフォームクラスを定義し、username、email、password、confirmというフィールドを設定しています。また、各フィールドにバリデーションルールを適用しています。

3. テンプレートでのフォームのレンダリング #

作成したフォームクラスをテンプレートでレンダリングするには、以下のように記述します。

{% from "_formhelpers.html" import render_field %}

<form method="POST">
    {{ render_field(form.username) }}
    {{ render_field(form.email) }}
    {{ render_field(form.password) }}
    {{ render_field(form.confirm) }}
    <input type="submit" value="Register">
</form>

ここでは、_formhelpers.htmlという名前のファイルに定義されたrender_fieldマクロを使用しています。このマクロは、フォームフィールドを適切なHTML要素としてレンダリングする役割を持っています。_formhelpers.htmlファイルは以下のように作成します。

{% macro render_field(field) %}
    <div class="form-group">
        {{ field.label(class="control-label") }}
        {{ field(class="form-control") }}
        {% if field.errors %}
            <div class="invalid-feedback">
                {% for error in field.errors %}
                    <span>{{ error }}</span>
                {% endfor %}
            </div>
        {% endif %}
    </div>
{% endmacro %}

このrender_fieldマクロは、フィールドのラベルと入力フィールドをレンダリングし、エラーがある場合はそのエラーメッセージも表示します。

4. ビュー関数でのフォームの処理 #

ビュー関数でフォームの送信を処理するには、以下のように記述します。

from flask import Flask, render_template, request, flash
from forms import RegistrationForm

app = Flask(__name__)
app.secret_key = 'your_secret_key'

@app.route('/register', methods=['GET', 'POST'])
def register():
    form = RegistrationForm(request.form)
    if request.method == 'POST' and form.validate():
        # フォームのデータをデータベースに保存するなどの処理を行う
        # ...
        
        flash('Registration successful!', 'success')
        return redirect(url_for('login'))
    return render_template('register.html', form=form)

この例では、/registerエンドポイントに対してGETリクエストが来た場合、register.htmlテンプレートをレンダリングしてフォームを表示します。POSTリクエストが来た場合、form.validate()メソッドを呼び出してバリデーションを実行し、バリデーションが成功した場合にデータの処理を行います。処理が完了したら、flashメッセージを表示してloginページにリダイレクトします。

このように、FlaskとWTFormsを使ってフォームを簡単に処理することができます。バリデーションやエラーメッセージの表示も容易に実装できるため、ユーザーにフレンドリーなインターフェースを提供することができます。