#準備
Python環境の用意→インストールはこちらから
Flaskのインストール
$ pip install flask
sqlachemyのインストール
$ pip install sqlachemy
requestsのインストール
$ pip install requests
DBの用意(今回はSQLite3)
#実行環境
MacOS 11.4
Python 3.9.0
SQLite 3.32.3
requests 2.24.0
sqlachemy 1.4.26
Flask 2.0.2
#webサーバーを立てる
今回は, ブラウザ上で選択したアイテムの値段を計算するwebサイトをマイクロサービスアーキテクチャもどきで作成する.
今回の機能としては以下の２つ
①dbに登録されている商品と値段を表示する
②選択した商品のみの表示
main.py
import json
import os
from flask import Flask, render_template, request
import requests
from orders_models import Order, new_Order
app = Flask(__name__, template_folder='templates')
@app.route("/")
def main():
all_item = Order.query.all() //Order.dbの全テーブルの全アイテムを取得
return render_template("index.html", all_item=all_item) //index.htmlにOrder.dbの中身を送る
@app.route("/add", methods=["post"])
def show():
url = 'http://loaclhost/order' //app.pyのURL
id_list = request.form.getlist("add") //htmlからaddメソッドを受け取る
for id in id_list:
payload = int(id)
requests.post(url=url, json=json.dumps(payload)) //データ部にidを格納してapp.pyに送る
all_item = new_Order.query.all() //new_Orderテーブル内の全アイテムを取得
return render_template("index.html", all_item=all_item)
if __name__ == "__main__":
app.run(debug=True, host='0.0.0.0', port=80)
app.py
import json
import os
from flask import Flask, render_template, request
from sqlalchemy.ext.asyncio import session
from sqlalchemy.orm import scoped_session, sessionmaker
from database import db_session
from orders_models import Order, new_Order
app = Flask(__name__, template_folder='templates')
@app.route("/order", methods=["post"])
def item():
data = json.loads(request.json)
content = Order.query.filter_by(id=data).first() //idが一致するデータを取り出す
i = new_Order(name=content.name, price=content.price) //ｄｂの更新
db_session.add(i)
db_session.commit()
if __name__ == "__main__":
app.run(debug=True, host='0.0.0.0', port=81)
index.html
<!DOCTYPE html>
<html>
<head>
<title>order.net</title>
</head>
<h1>メニュー表</h1>
{% for item in all_item %}
<div>
<input type="checkbox" name="add" form="add" value={{item.id}}>
{{item.name}}：{{item.price}}
</div>
{% endfor %}
<form action="/add" method="post" id="add">
<input type="submit" value="買い物かごに追加する">
</form>
</body>
</html>
#実際に動かしてみた
