11
18

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

Python web フレームワーク Flask入門

Last updated at Posted at 2021-05-27

Pythonのwebフレームワークの簡単な機能をまとめる。

Pythonで簡単なwebサイトを作りたい場合、webフレームワークを使用すれば簡単に実装できる。
その手順を簡単に説明する。
詳しい説明を行う前にwebフレームワークの主な機能を整理しておく。

  1. ルーティング・・・URLを解釈し、対応するサーバーにあるファイルを見つける。

  2. テンプレート・・・サーバーにあるデータをHTMLページに流し込む。

  3. 認証と権限付与・・・ユーザー名、パスワード、パーミッション(許可)を処理する。

  4. セッション・・・ユーザーがウェブサイトを観覧している時、一時的なデータストレージを保持する。



まず、簡単なwebフレームワークであるFlaskを紹介する。
FlaskはFacebook認証やデータベース統合など本格的なweb開発にも使用される機能を備えている。
まずはFlaskをインストールしてみよう。

pip install flask

まずは簡単なwebページを作ってみる
現在のディレクトリ内に表示したいindex.htmlを入れておこう。

./
├flask1.py
├index.html


index.html
Hello World!

flask1.py
from flask import Flask

app = Flask(__name__, static_folder='.', static_url_path='')

@app.route('/')
def home():
    return app.send_static_file('index.html')

app.run(port=9999, debug=True)

そしてターミナルかウィンドウでからサーバーを実行する

python flask1.py

ブラウザに以下のURLを入力してホームページを出力してみよう。以下の様に表示されるはずだ。
http://127.0.0.1:9999/

Hello World!

runを呼び出す際、debugをTrueにしておくことにより、
サーバーコードでエラーが発生した時、どこで問題を起こしたのか詳細な情報を特別な書式で表示したページで返してくれる。
(ただ、本番環境ではdebug =Trueにしてはならない! サーバーについて多くの情報を漏らす危険性を考慮して)






続いてtemplatesというディレクトリを作成し、その中にFlask2.htmlを作成しよう。

./
├ flask1.py
├ index.html
├ templates/ flask2.html

flask2.htmlの内容は以下のようにしてみる

flask2.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Flask2 Sample</title>
</head>
<body>
    Please enter your favorite food :  {{favo_food}}
</body>
</html>

次にこのテンプレートを読み込んでthingにユーザーが渡してきた値を埋め込み、
HTMLファイルとしてユーザーのブラウザー画面にレンダリングするサーバーコードを記述する。

flask1.pyを以下のように書き換える。

flask1.py
from flask import Flask, render_template

app = Flask(__name__, static_folder='.', static_url_path='')

@app.route('/echo/<fb_food>')
def echo(fb_food):
    return render_template('flask2.html', favo_food=fb_food)

app.run(port=9999, debug=True)

いつものようにflask1.pyを実行する。

python flask1.py

ブラウザに以下のURLを入力してホームページを出力してみよう。以下の様に表示されるはずだ。http://127.0.0.1:9999/echo/banana

Please enter your favorite food : banana

 
今回は@app.route('/')の代わりに@app.route('/echo/')を指定した。
よってURLではhttp://127.0.0.1:9999/echo/好きな食べ物 と指定してあげる必要がある。




次にtemplatesファイル内のflask2.htmlを以下のように編集しよう。
flask2.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Flask2 Sample</title>
</head>
<body>
    Please enter your favorite food :  {{favo_food}}
    Please enter your favorite drink : {{favo_drink}}
</body>
</html>

今回はhtml内に引数が2つ存在する。その指定方法は複数存在するが、その方法を2つ紹介する。


1つ目は単純にURL自体を拡張することによる手法だ。 以下のようにflask1.pyを書き換える。
flask1.py
from flask import Flask, render_template

app = Flask(__name__, static_folder='.', static_url_path='')

@app.route('/echo/<fb_food>/<fb_drink>')
def echo(fb_food, fb_drink):
    return render_template('flask2.html', favo_food=fb_food, favo_drink=fb_drink)

app.run(port=9999, debug=True)

いつものようにflask1.pyをターミナル上で実行してあげると

python flask1.py

今回は以下のようにURLを指定する
http://127.0.0.1:9999/echo/banana/milk

すると
以下のように表示されるはずだ。

Please enter your favorite food : banana
Please enter your favorite drink : milk


2つ目は引数をGET引数として渡す手法である。

以下のようにflask1.pyを書き換える。

flask1.py
from flask import Flask, render_template, request

app = Flask(__name__, static_folder='.', static_url_path='')


@app.route('/echo/')
def echo():
    fb_food = request.args.get('fb_food')
    fb_drink = request.args.get('fb_drink')
    return render_template('flask2.html', favo_food=fb_food, favo_drink=fb_drink)

app.run(port=9999, debug=True)


いつもの通り実行を行う。

python flask1.py

今回はURLを以下のように指定する。
http://127.0.0.1:9999/echo?fb_food=banana&fb_drink=milk

すると先ほどと同じ結果が得られる。

今回はURLに対してGETコマンドを実行した。
GETコマンドを指定してあげるとき、
?key1=vall&key2=val2...のような形で任意の引数渡すことができる。
ただし、引数名はpythonファイル内で

request.args.get('key1')

のような形で指定してあげる必要がある。

11
18
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
11
18

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?