【 Flask 教學 】 透過 URL 傳遞參數與透過表單傳遞

通過 URL 傳遞參數

嗨,動態路由你好!

Flask 是一個輕量級的 Web 框架,提供了簡單易用的路由定義和視圖函數。其中一個優勢是通過 URL 傳遞參數的能力,也就是動態路由。在這個路由方式下,URL 中的一部分可以作為參數傳遞到視圖函數中,從而實現不同的動態內容呈現。

1
2
3
@app.route('/greet/<name>')
def greet(name):
return f'Hello, {name}!'

此路由接受 URL 中的 name 參數,我們可以通過 name 參數在函數中訪問它。例如,如果我們輸入網址 http://localhost:5000/greet/Bob,我們將在頁面上看到 “Hello, Bob!”。

在 Flask 中,使用動態路由需要在路由定義中使用 <parameter_name> 語法,指定要傳遞的參數名稱。這個參數可以是任何類型的資料,包括整數、字符串、浮點數等等。在視圖函數中,我們可以使用這個參數來生成不同的內容。

根據網址的文章 id 導向該篇文章

下面我們來看一個具體的例子,假設我們有一個博客網站,每一篇文章都有一個獨特的 ID,我們希望通過 URL 顯示不同的文章內容。那麼,我們可以使用以下的路由定義:

1
2
3
4
@app.route('/article/<int:article_id>')
def show_article(article_id):
# 在這裡使用 article_id 來顯示文章內容
return '這是文章 %d 的內容' % article_id

在上述程式碼中,<int:article_id> 指定了我們要傳遞一個整數類型的參數 article_id。在視圖函數 show_article 中,我們使用了這個參數來顯示文章內容。這個函數只是一個簡單的範例,實際情況中,我們可以從資料庫中獲取文章內容,然後將其呈現在網頁上。

當使用者訪問 /article/123 時,Flask 會自動提取 URL 中的 123,並將其傳遞到 show_article 視圖函數中。因為我們使用了 <int:article_id>,Flask 會自動確認 123 是一個整數類型的資料,並將其轉換成 article_id 參數的值。然後,視圖函數會使用 article_id 來顯示文章內容。

顯示名稱為 username 的使用者資料

在 Flask 中,我們可以使用多個動態路由參數,例如:

1
2
3
4
@app.route('/@app.route('/user/<username>/int:user_id')')
def show_user(username, user_id):
# 在這裡使用 username 和 user_id 來顯示使用者資料
return '使用者名是 %s,ID 是 %d' % (username, user_id)

在這個路由定義中,我們使用了兩個動態路由參數,<username><int:user_id>。在視圖函數 show_user 中,我們使用了這兩個參數來顯示使用者資料。

動態路由注意事項

使用動態路由時需要注意以下幾點:

  1. 參數的類型必須指定。在上面的例子中,我們使用 <int:article_id><username> 指定了參數的類型。
  2. 參數名稱必須和視圖函數中的參數名稱相同。
  3. 參數的類型轉換是自動進行的,如果轉換失敗,Flask 會返回 404 錯誤頁面。

總而言之,動態路由是 Flask 提供的一個強大的功能,可以讓我們通過 URL 傳遞參數,實現不同的動態內容呈現。通過 <parameter_name> 語法指定參數名稱和類型,在視圖函數中使用參數來生成不同的內容。使用時需要注意參數類型和名稱,以及類型轉換可能出現的錯誤。

透過表單傳遞資料

範例程式

以下是一個簡單的 Flask 程式,可以處理表單資料:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
from flask import Flask, render_template, request

app = Flask(__name__)

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

@app.route('/submit', methods=['POST'])
def submit():
name = request.form.get('name')
age = request.form.get('age')
return f'Hello {name}, you are {age} years old!'

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

這個程式定義了兩個路由:

  • /:顯示一個網頁,該網頁包含一個表單,該表單要求使用者輸入姓名和年齡。
  • /submit:處理提交的表單資料,並顯示一條歡迎消息,包含使用者的姓名和年齡。

這個程式需要一個名為 index.html 的模板文件,該文件定義了表單的 HTML 程式碼。以下是 index.html 的範例程式碼:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!DOCTYPE html>
<html>
<head>
<title>Flask Form Example</title>
</head>
<body>
<h1>Enter your name and age:</h1>
<form method="POST" action="/submit">
<label for="name">Name:</label>
<input type="text" name="name" id="name">
<br>
<label for="age">Age:</label>
<input type="number" name="age" id="age">
<br>
<button type="submit">Submit</button>
</form>
</body>
</html>

這個模板文件顯示一個表單,要求使用者輸入姓名和年齡,然後提交表單。表單使用 POST 方法提交到 /submit 路由。

Flask 中的 request.form

回頭看 Python 主程式

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
from flask import Flask, render_template, request

app = Flask(__name__)

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

@app.route('/submit', methods=['POST'])
def submit():
name = request.form.get('name')
age = request.form.get('age')
return f'Hello {name}, you are {age} years old!'

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

在 Flask 中,request.form 是一個特殊的 Python 字典,用於處理 POST 方法所傳送的表單資料。當使用者在表單中輸入資料並提交時,POST 請求將表單資料打包在請求主體 (request body) 中,並將其傳送到伺服器。Flask 中的 request 物件可以獲取這些表單資料,request.form 字典會將表單中所有名為 “name” 的欄位值映射到 request.form['name'] 的字典鍵上。

在這段程式碼中,submit() 函數使用 request.form.get() 方法從提交的表單資料中獲取使用者名字和年齡。request.form.get() 方法的作用是從 request.form 字典中獲取指定名稱的值,如果字典中不存在指定名稱的值,則返回 None。例如,name = request.form.get('name') 將會從 POST 請求中獲取名為 “name” 的欄位值,如果不存在這個欄位則返回 None。同理,age = request.form.get('age') 則會從 POST 請求中獲取名為 “age” 的欄位值。最後,這些表單資料可以用來產生回應內容,如 “Hello {name}, you are {age} years old!”。

當使用者提交表單時,Flask 調用 submit 函數處理表單資料。這個函數從 request 對象中獲取 nameage 字段的值,然後使用這些值顯示一條歡迎訊息。

請注意,在實際應用中,你應該對提交的資料進行驗證和清理,以防止不良使用者輸入無效資料或惡意資料。你還應該對資料進行適當的安全處理,以保護你的應用免受攻擊。

總結

在這個教學中,我們學習了如何在 Flask 中定義路由以及如何處理 URL 參數和表單資料。Flask 為構建 Web 應用程式提供了一個靈活而強大的框架,了解如何定義路由是構建任何 Flask 應用程式的關鍵部分。

評論