はじめに
研修で、flaskを使用してAPIを実行するアプリケーションを作成した。
flaskを使用することで、webアプリケーションのバックグラウンドをpythonで記述することができるようだ。
install と import
pip install flask
でインストールをすることができる。
importする際には、
from flask import Flask
とインポートする。
基本の使い方
初めに、app.pyファイルを作成する。
flaskを実行したディレクトリ中のapp.pyが実行される。
app.pyファイルの中身について説明をする。
app = Flask.app()
初めに/
が呼ばれるため、@app.route("/")
を使用し関数index()
を定義する。
@app.route("/")
def index():
return "Hello, World"
実行する為には、flask run
コマンドを使用する。
flask run
次のようなWebページ( http://127.0.0.1:5000 )が生成される。
これは、ローカルホストとして実行している。よって、このURLを共有しても他のインターネットに接続しているユーザーはブラウザにアクセスすることができない。
HTMLの表示
flaskを使用することで、htmlで作成したファイルを表示させることもできる。その為には、次のようなディレクトリ構造を作成する必要がある。
app.py
templates/index.html
template
ディレクトリ中にhtmlファイルを作成する。
<!DOCTYPE html>
<html lang="ja">
<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>テストWebアプリ</title>
</head>
<body>
<h1>index.html表示してます</h1>
</body>
</html>
app.py
も次のように書き換える
import sys, os
from flask import Flask ,render_template
app = Flask(__name__)
@app.route("/")
def index():
return render_template("index.html")
実行結果は次のようになる。
ボタン機能の追加
簡単なボタンを作成し、ボタンが押された場合に文字列を表示させるように追記する。
なお、表示させる文字列は、app.py側で指定できるようにする。
まずは、新しいhtmlファイルを作成する。
<!DOCTYPE html>
<html lang="ja">
<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>テストWebアプリ</title>
</head>
<body>
<h1>index.html表示してます</h1>
<!-- ボタンフォーム:POSTで同じURLに送信 -->
<form method="POST" action="/button">
<button type="submit">ボタン</button>
<!-- ボタンが押されたときに表示されるメッセージ -->
<p>{{ message }}</p>
</form>
</body>
</html>
formを追加している。formのaction
をbutton
と設定している。この変数名を使用し、flask側で処理を実行する。
次に、python側の変更点についてみていく。
import sys, os
from flask import Flask ,render_template, request
app = Flask(__name__)
@app.route("/", methods=["GET", "POST"])
def index():
return render_template("index.html")
@app.route("/button", methods=["GET", "POST"])
def button():
message = "app.pyからのメッセージ"
if request.method == "POST":
return render_template("index.html", message = message)
このように、@app.route()
の引数として/button
を使用している。
また、戻り値として、message
を追加している。
上記app.py
を実行すると次の結果を得られる。
他にもhtmlのformを使用することでさまざまな動作を作成することができる。
まとめ
JavaScriptをあまり使用したことがないため、JavaScriptを使用した実例は避けたが、今後、JavaScriptを使用していく上で有用な方法があれば紹介する。
action属性の名称を設定するだけで簡単に動作するので扱いやすいと感じた。