2023-02-16Python / Flask 教學

【 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 對象中獲取 name 和 age 字段的值，然後使用這些值顯示一條歡迎訊息。

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

總結

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

歡迎訂閱，獲取最新資訊、教學文章，一起變強。

評論

×