前幾天已經知道了蠻多有關Flask的基本觀念了，那今天我們來實作看看如何在Flask上傳檔案吧。

資料夾結構

首先我們先看一下我們今天的資料夾結構，我們可以注意到有一個uploads資料夾，如果沒有創建的話，之後下面程式碼也會幫你創建喔。

鐵人賽
│
├─ app.py
│
├─ uploads # 上傳文件時儲存的位址
│
└─ templates
    │
    └─ index.html # 前端頁面

程式

接著我們我們一步步來看程式碼吧。
app.py

app.py建立Flask應用

from flask import Flask, render_template, request
import os

app = Flask(__name__)

# 設定上傳文件的最大為16MB
app.config['MAX_CONTENT_LENGTH'] = 16 * 1024 * 1024

# 定義上傳資料夾的位址
UPLOAD_FOLDER = os.path.join(os.getcwd(), 'uploads')

首先，當然事先匯入了必要的模塊，並建立了一個Flask應用。接著完成一些基本的設定，包括上傳文件的最大為16MB還有上傳文件的儲存資料夾位址。

前端頁面

index.html

<h1>上傳文件</h1>
<form method="POST" enctype="multipart/form-data" action="{{ url_for('upload') }}">
    <label for="filename">選擇文件：</label>
    <input type="file" name="file" id="filename" accept="image/*" required>
    <br>
    <input type="submit" value="上傳">
</form>

這個HTML表單包括了一個標題和一個文件上傳表單。我們可以使用enctype="multipart/form-data"來確保能夠上傳文件。另外設置了accept="image/*"，來確保只允許上傳圖片類型的文件，可以根據自己的需求更改這個設定。

• 影像、視訊以及聲音的MIME類型設置如下：
  • 代表任意影像檔：”image/*”
  • 代表任意視訊檔：”video/*”
  • 代表任意聲音檔：”audio/*”

實現文件上傳 - upload路由

最後我們看一下如何實現文件上傳功能的Flask路由。我們在app.py中新增

# 路由定義 - 上傳頁面
@app.route('/upload', methods=['POST'])
def upload():
    if 'file' not in request.files:
        return 'No file part'

    file = request.files['file']

    if file.filename == '':
        return 'No selected file'

    if file:
        # 確保上傳資料夾存在
        if not os.path.exists(UPLOAD_FOLDER):
            os.makedirs(UPLOAD_FOLDER)

        # 儲存文件到上傳資料夾
        file.save(os.path.join(UPLOAD_FOLDER, file.filename))

        return 'File uploaded successfully'

在這個路由中，我們首先檢查是否有文件被上傳，然後檢查文件是否被選擇。如果文件存在，我們確保上傳資料夾存在，並將文件儲存到該資料夾中。最後，我們返回一條成功上傳的消息。