Python Web Flask — 使用SQLAlchemy資料庫
By: Sean Yeh
Tags: Flask Framework, Sql, Python3, Flask, Python

我們就從使用者頁面的樣板開始吧！

user頁的表單

我們在templates資料夾裡面的user.html ，加上一個<form>表單，裡面有一個<input>可以用來輸入email，與一個<button>按鈕可以用來submit傳送資料。<form>表單傳送資料的方式採用POST（method=”post”）。

簡化的form表單如下：

<form action="#" method="post">

<div>

<input type="email" name="email" placeholder="請輸入email" value="{{email if email}}">

</div>

<div>

<button type="submit">確認送出</button>

</div>

</form>

如果加上CSS裝飾後，user.html樣板如下：

{% extends "base.html" %} {% block title %}User Page{% endblock %} {% block body %}

<div class="jumbotron jumbotron-fluid">

<div class="container">

<h1 class="display-4">Hello {{user}}</h1>

<p class="lead">歡迎 {{user}}來到會員專區</p>

<form action="#" method="post">

<div class="form-group">

<input type="email" name="email" class="form-control" placeholder="請輸入email" value="{{email if email}}">

</div>

<div class="form-group">

<button type="submit" class="btn btn-primary">確認送出Email</button>

</div>

</form>

</div>

</div> {% endblock %}

在Python程式部分，我們要調整form.py。在user()的request方式，要加上POST與GET兩種方法：

@app.route("/user", methods=["POST","GET"])

接下來調整user()函式，先設定email為None：

email = None

判斷式：

if request.method == "POST":

email = request.form["email"]

session["email"] = email

else:

if "email" in session:

email = session["email"] return render_template("user.html",user=user, email=email)

如果是採取POST方法的時候（ if request.method == "POST": ），就去取得頁面上input輸入欄位裡面輸入的email（ email = request.form["email"] ），並且將取得的email值設定在session中（ session["email"] = email ）。

反之，若條件不成立（沒有使用POST方法）時，就取得session中的email值。

if "email" in session:

email = session["email"]

如果以上兩者皆非，既沒有POST也沒有session，就直接顯示user.html樣板頁。

return render_template("user.html",user=user, email=email)

接下來，資料庫要進場：

在 if request.method == “POST”: 的程式區段，我們要加上資料庫相關程式。前面我們設定了資料庫為 sqlite:///users.sqlite3 。因此，要從資料庫裡面尋找name欄位是否已經存在user，如果有的話即設定email為輸入的email，並且存入資料庫中，存入資料庫前必須先commit（db.session.commit()）。

found_user = users.query.filter_by(name=user).first()

found_user.email = email

db.session.commit()

於是，整個user函式如下：

def user():

email = None

if "user" in session:

user = session["user"]



if request.method == "POST":

email = request.form["email"]

session["email"] = email

found_user = users.query.filter_by(name=user).first()

found_user.email = email

db.session.commit()



else:

if "email" in session:

email = session["email"]





return render_template("user.html", email=email)

else:

return redirect(url_for("login"))

列表頁面

接著，要做一個view的列表頁面，頁面中顯示所有進入user資料庫的紀錄。view.html樣板如下：

{% extends "base.html" %} {% block title %}View All Users{% endblock %} {% block body %}

<div class="jumbotron jumbotron-fluid mt-5">

<div class="container">

<h1 class="display-4">查看所有名單</h1> <ul class="list-group">

{% for item in values%}

<li class="list-group-item">

<h5 class="mb-1">姓名： {{item.name}}</H5>

<p class="mb-1">電子郵件： {{item.email}}</p>

</li>

{% endfor %}

</ul> </div> </div>

{% endblock %}

樣板中，我們透過for迴圈顯示values裡面個別的name與email（如下面程式碼部分）：

{% for item in values%}

<li class="list-group-item">

<h5 class="mb-1">姓名： {{item.name}}</H5>

<p class="mb-1">電子郵件： {{item.email}}</p>

</li>

{% endfor %}

而這個values則是從下面的 values=users.query.all() 而來。query.all()會對資料庫進行資料的取出。

修改login

最後我們要回過來修改login的部分。在這裡我們要加上與資料庫有關的程式碼：

found_user = users.query.filter_by(name=user).first()

if found_user:

session["email"]= found_user.email

else:

usr = users(user,"")

db.session.add(usr)

db.session.commit()

透過這一段程式碼，我們可以找到資料庫中的user是否與登入的使用者一樣。反之，就存入資料庫成為一個新的紀錄。

完整的login函式如下：



def login():

if request.method == "POST":

session.permanent = True

user = request.form["nm"]

session["user"] = user



found_user = users.query.filter_by(name=user).first()

if found_user:

session["email"]= found_user.email

else:

usr = users(user,"")

db.session.add(usr)

db.session.commit()



return redirect(url_for("user"))

else:

if "user" in session:

return redirect(url_for("user"))

return render_template("login.html") @app .route("/login", methods=["POST","GET"])def login():if request.method == "POST":session.permanent = Trueuser = request.form["nm"]session["user"] = userreturn redirect(url_for("user"))else:if "user" in session:return redirect(url_for("user"))return render_template("login.html")

請使用下面步驟執行看看：

先進入首頁：http://127.0.0.1:5000/

再到登入頁：http://127.0.0.1:5000/login

輸入名稱，按下「確認送出」進入http://127.0.0.1:5000/user頁

輸入email後，按下「確認送出Email」

自行進入http://127.0.0.1:5000/view頁，看看剛剛輸入的email是否存在清單中？

執行的結果是否與原來計畫的一樣？