カテゴリ: Flask 更新日: 2025/12/03

Flaskでフォームを作成してデータを送信する基本のやり方をやさしく解説

Flaskでフォームを作成してデータを送信する基本のやり方をやさしく解説
Flaskでフォームを作成してデータを送信する基本のやり方をやさしく解説

先生と生徒の会話形式で理解しよう

生徒

「PythonのFlaskを使って、入力フォームを作りたいんですが、どうすればいいですか?」

先生

「Flask(フラスク)はPythonでWebアプリケーションを作るための軽量なフレームワークです。フォームを作って、入力されたデータを受け取るのも簡単ですよ。」

生徒

「HTMLとかPOSTとか聞いたことあるけど、難しそうです……」

先生

「大丈夫です。簡単な言葉と例えを使って、ゼロからゆっくり説明しますね!」

1. フォームとは?Webページにある入力欄

1. フォームとは?Webページにある入力欄
1. フォームとは?Webページにある入力欄

まず、「フォーム」というのは、インターネット上でよく見る「名前を入力してください」や「お問い合わせ内容を入力してください」のような部分です。これはHTMLというWebページを作るための言語で書かれます。

ユーザーが文字を入力して「送信」ボタンを押すと、その情報がサーバーに送られます。これを「POST(ポスト)」と呼びます。これは「手紙をポストに入れる」イメージと同じです。

2. Flaskでフォームを表示するHTMLを書く

2. Flaskでフォームを表示するHTMLを書く
2. Flaskでフォームを表示するHTMLを書く

HTML(エイチティーエムエル)は、ホームページの見た目を作る言語です。Flaskではテンプレート(ひな型)を使って、このHTMLを表示できます。

以下のコードは「名前」と「メッセージ」を入力する簡単なフォームです。ファイル名は templates/form.html にしましょう。


<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>フォーム入力</title>
</head>
<body>
    <h1>お問い合わせフォーム</h1>
    <form method="POST">
        <label>お名前:</label><br>
        <input type="text" name="name"><br><br>
        <label>メッセージ:</label><br>
        <textarea name="message"></textarea><br><br>
        <input type="submit" value="送信">
    </form>
</body>
</html>

3. Flaskでフォームを表示・受け取るコードを書く

3. Flaskでフォームを表示・受け取るコードを書く
3. Flaskでフォームを表示・受け取るコードを書く

次に、PythonでFlaskを使って、フォームの画面を表示したり、送られたデータを受け取ったりするコードを書きます。

このコードは、app.py という名前で保存しましょう。


from flask import Flask, render_template, request

app = Flask(__name__)

@app.route('/', methods=['GET', 'POST'])
def form():
    if request.method == 'POST':
        name = request.form['name']
        message = request.form['message']
        return f"こんにちは、{name}さん!\nあなたのメッセージ: {message}"
    return render_template('form.html')

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

4. 実行してフォームを使ってみよう!

4. 実行してフォームを使ってみよう!
4. 実行してフォームを使ってみよう!

上記の app.py を保存してから、コマンドライン(黒い画面)で以下を実行してみてください。

  
python app.py

ブラウザで http://localhost:5000 を開くと、フォーム画面が表示されます。名前とメッセージを入力して「送信」すると、入力された内容が画面に表示されます。

5. Flaskのフォーム処理をもっとわかりやすく

5. Flaskのフォーム処理をもっとわかりやすく
5. Flaskのフォーム処理をもっとわかりやすく

「Flaskでフォーム作成」「Flask POST送信」「Flask 入力欄の作り方」などで検索される内容を整理しておきましょう。

  • Flaskとは? PythonでWebアプリを作るための軽量な道具です。
  • HTMLとは? Webページの見た目を作るための言語です。
  • フォームとは? ユーザーが入力する部分(名前・メッセージなど)です。
  • POSTとは? 入力内容をサーバーに送信する方法です。
  • request.formとは? 送られてきたデータをPythonで受け取る方法です。

このように、Flaskでは初心者でもフォームを使ったデータ送信が簡単にできます。最初は難しく感じるかもしれませんが、少しずつ慣れていけば大丈夫です!

まとめ

まとめ
まとめ

Flaskでフォームを作り、ユーザーからの入力を受け取り処理する方法は、Webアプリケーション開発において欠かせない基本的な仕組みです。今回の記事では、フォームの役割、POST送信の流れ、HTMLテンプレートの配置、Flaskのルーティング、そして受け取ったデータの扱い方までを体系的に学びました。特に、フォーム構築とFlaskの組み合わせはシンプルでありながら応用範囲が広く、実際のサービスやアプリ開発でも頻繁に使われます。

フォームはユーザーとサーバーをつなぐ大切な架け橋であり、名前やメッセージなどの情報を入力してもらい、それをサーバー側で受け取り動作させることで「問い合わせフォーム」「ログイン画面」「検索窓」「投稿機能」など、多様な仕組みを作り出すことができます。Flaskではこのフォーム処理を驚くほどシンプルな記述で実現できるため、初心者でもわかりやすく取り組みやすいことが大きな魅力です。

HTML側では、<form>タグを使い、method="POST"を指定することでデータ送信が可能になります。テキスト入力欄やテキストエリアを配置し、送信ボタンを押すとサーバーにデータが送られます。この送信されたデータをPython側で受け取るのがrequest.formであり、辞書形式のデータから値を取り出して処理します。今回のサンプルでは、名前とメッセージを受け取りブラウザに返すというシンプルなものでしたが、これを応用すれば、データベースへの保存、別ページへの遷移、メール送信、ログ記録などさまざまな機能に発展できます。

また、Flaskのルーティングでは、@app.route('/', methods=['GET', 'POST']) のように記述することで、同じURLでもGETとPOSTの両方に対応できる柔軟な動作が可能です。ページを表示するときはGET、フォーム送信後はPOSTという流れが自然に整理され、初心者にも理解しやすい構造となっています。

さらに、テンプレートファイルをtemplatesフォルダに配置し、render_template()を使って表示する仕組みは、Flaskアプリ全体の見通しを良くするためにも欠かせません。HTMLをPythonコードと分離して管理できるため、画面設計とロジックの両方を整理しやすくなり、学習が進むほど「この作り方がとても便利だ」と実感できるはずです。

ここからさらにステップアップすると、フォームバリデーション、CSRF対策、WTFormsの利用、ファイルアップロード処理など、より高度なフォーム技術にも進むことができます。まずは今回の基本をしっかり理解し「フォームの構造」「POST送信の仕組み」「Flaskでの受け取り方」を身につけることが大切です。

■ Flaskフォームの応用サンプルコード


<!-- templates/contact.html -->
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>お問い合わせ</title>
</head>
<body>
    <h1>お問い合わせフォーム</h1>
    <form method="POST">
        <label>お名前:</label><br>
        <input type="text" name="name"><br><br>

        <label>メールアドレス:</label><br>
        <input type="email" name="email"><br><br>

        <label>お問い合わせ内容:</label><br>
        <textarea name="content"></textarea><br><br>

        <input type="submit" value="送信">
    </form>
</body>
</html>

# app.py
from flask import Flask, render_template, request

app = Flask(__name__)

@app.route('/contact', methods=['GET', 'POST'])
def contact():
    if request.method == 'POST':
        name = request.form['name']
        email = request.form['email']
        content = request.form['content']
        return f"{name}さん({email})からのお問い合わせ内容:<br>{content}"
    return render_template('contact.html')

if __name__ == "__main__":
    app.run(debug=True)

このように、入力欄を増やしたり種類を変えるだけで、実際のアプリに近いフォーム機能を簡単に作れます。受け取ったデータをそのまま画面に返すだけでなく、ファイルへ保存したり、別ページに表示したり、データベースへ保存するなど、機能の広げ方は無限にあります。

先生と生徒の振り返り会話

生徒:「フォームってただの入力欄かと思っていましたが、Flaskと組み合わせるといろんな機能が作れるんですね!」

先生:「その通りです。フォームの仕組みはシンプルですが、応用すればアプリの中心になる大切な部分ですよ。」

生徒:「POSTで送るとか、request.formで受け取るとか、流れが少し見えてきました!」

先生:「流れを理解すれば一気に楽になります。テンプレート表示とフォーム送信の動きがわかれば、機能追加も簡単ですよ。」

生徒:「次はデータベースに保存したり、確認画面を作ったりもできそうですね!」

先生:「その意欲が何より大切です。今回学んだ基本を土台に、どんどん機能を作ってみてくださいね。」

この記事を読んだ人からの質問

この記事を読んだ人からの質問
この記事を読んだ人からの質問

プログラミング初心者からのよくある疑問/質問を解決します

Flaskでフォームを作成するにはどうすればいいですか?初心者でも簡単にできますか?

はい、FlaskではHTMLのformタグを使い、render_template関数で表示すれば、簡単に入力フォームが作れます。PythonのコードでPOSTメソッドを受け取る処理を追加するだけでフォーム機能が完成します。
カテゴリの一覧へ
新着記事
New1
Flask
Flaskでデータベースエラーを処理する方法!初心者にもわかる例外の使い方
New2
Flask
FlaskでリダイレクトやURL生成を行う方法!便利な関数の使い方を解説
New3
Flask
FlaskでPOSTリクエストを受け取る方法!初心者でもわかるJSONデータの受け取り方
New4
Flask
Flask‑Mailの使い方!アプリからメールを送信する基本方法を解説
人気記事
No.1
Java&Spring記事人気No1
Django
Django環境構築の全手順を完全解説!初心者でも迷わないPython・Djangoセットアップガイド
No.2
Java&Spring記事人気No2
Django
DjangoとFlaskの違いを完全比較!初心者でもわかるPythonフレームワーク入門
No.3
Java&Spring記事人気No3
Python
Pythonでリストをコピーする方法!copy()・スライス・list()の使い方を比較
No.4
Java&Spring記事人気No4
Python
Pythonの文字列を1文字ずつ処理する方法!for文やlist化の活用例
No.5
Java&Spring記事人気No5
Flask
FlaskアプリをNginx + Gunicornで本番運用する方法!初心者でもわかるデプロイ構成の基本
No.6
Java&Spring記事人気No6
Python
PythonでHello Worldを表示するには?初心者向けに最初の1行を実行してみよう
No.7
Java&Spring記事人気No7
Python
Pythonのmatch文(パターンマッチング)とは?switch文の代替としての使い方をやさしく解説
No.8
Java&Spring記事人気No8
Flask
FlaskアプリのSECRET_KEYの設定方法を完全ガイド!初心者でもわかるセキュリティ対策