本文為 Django 圖片上傳功能系列教學，第 14 篇：
- Django 實現用戶圖片上傳功能：10 步驟詳細解析
- Django 圖片上傳功能完整代碼解析
- Django 模型中的三種主要關聯方式
- Django 中的 ImageField：簡單介紹與進階設定
- Django 中的 blank=True 和 null=True：深度解析
- Django Signals 的基礎入門
- 深入解析 Django 的 @receiver 裝飾器：原理與實踐
- Django 圖片上傳功能：信號執行函數設計解析
- 如何在 Django 中載入和使用信號（Signals）
- Django 模型建立後的必備步驟：執行 migrate
- 使用 Django 創建用戶個人資訊更新表單
- 如何使用 Django 更新用戶個人資料
- 深入了解 HTML 表單的 enctype=”multipart/form-data”
- Django 中媒體檔案處理：設定與執行解析 👈 所在位置
- Django 專案中靜態與媒體檔案的正確配置指南
- Django 動態讀取頭像：模板與上下文的最佳實踐
在 Django 專案中，處理媒體檔案（例如用戶上傳的圖片或影片）涉及兩個核心部分：settings.py 的配置和 urls.py 的設定。
以下將詳盡解析相關步驟與執行邏輯，讓新手能快速掌握這一常見需求的處理方式。
settings.py 的配置
MEDIA_URL = '/media/'
MEDIA_ROOT = BASE_DIR / 'media'配置解析
MEDIA_URL：- 定義媒體檔案的 URL 前綴。
- 當用戶通過瀏覽器訪問以
/media/為開頭的路徑時，Django 能識別該請求是針對媒體檔案的。
MEDIA_ROOT：- 定義媒體檔案實際存儲的伺服器路徑。
- 在上述範例中，檔案將存儲在專案根目錄（
BASE_DIR）下的media資料夾中。
實例舉例
假設用戶上傳了一張名為 photo.jpg 的圖片：
- 實際存儲位置：
BASE_DIR / 'media' / 'photo.jpg' - 瀏覽器訪問該文件的 URL：
http://<你的域名>/media/photo.jpg
urls.py 的設定
from django.conf import settings
from django.conf.urls.static import static
if settings.DEBUG:
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)解析代碼邏輯
from django.conf import settings- 導入 Django 的設定模組，用於檢查
settings.py中的配置（如MEDIA_URL、MEDIA_ROOT和DEBUG）。
- 導入 Django 的設定模組，用於檢查
from django.conf.urls.static import static- 導入 Django 提供的輔助函數
static()，專門用於處理靜態檔案和媒體檔案的請求。
- 導入 Django 提供的輔助函數
if settings.DEBUG:- 僅在開發模式（
DEBUG = True）下啟用以下邏輯，避免生產環境由 Django 處理靜態檔案或媒體檔案的請求。
- 僅在開發模式（
static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)- 作用：
- 匹配以
MEDIA_URL開頭的請求（如/media/）。 - 將請求映射到
MEDIA_ROOT所指定的目錄，並返回對應文件。
- 匹配以
- 作用：
執行過程
假設 settings.py 的配置如下：
MEDIA_URL = '/media/'
MEDIA_ROOT = BASE_DIR / 'media'
- 當用戶訪問以下 URL：
http://127.0.0.1:8000/media/my_image.jpg- Django 執行步驟：
- 檢查 URL 是否以
/media/開頭。 - 如果符合，轉到伺服器上的
MEDIA_ROOT目錄中查找文件my_image.jpg。
- 檢查 URL 是否以
- 文件存在時，Django 返回文件內容作為 HTTP 回應，用戶即可在瀏覽器中查看。
為何在 DEBUG 條件下配置？
開發環境與生產環境的差異
- 開發環境（
DEBUG = True）：- Django 的內建伺服器（
runserver）能直接處理靜態檔案和媒體檔案。 - 在開發過程中，方便測試檔案的上傳與存取。
- Django 的內建伺服器（
- 生產環境（
DEBUG = False）：- Django 不會處理靜態檔案和媒體檔案。
- 為了更高效地提供服務，通常由專業的 Web 伺服器（如 Nginx 或 Apache）負責這些任務。
流程圖
用戶請求媒體檔案：
http://example.com/media/uploads/user_photo.jpg
前台瀏覽器 -> Django 後端處理 -> 資料庫與檔案系統合作 -> 回傳媒體檔案詳細流程如下：
1. 前台索取資料
+-------------------------------------+
| 瀏覽器發送 GET 請求到 Django URL |
| URL: /media/uploads/user_photo.jpg |
+-------------------------------------+
|
v
2. Django 接收到請求：
+------------------------------------------------------+
| 檢查 URL 是否符合 MEDIA_URL 前綴 (/media/) |
| 是 -> 繼續執行 |
| 否 -> 返回 404 錯誤 |
+------------------------------------------------------+
|
v
3. Django 在資料庫中查詢路徑 (如果涉及資料庫)
+------------------------------------------------------+
| 模型字段中存儲的是文件路徑，例如： |
| `photo = uploads/user_photo.jpg` |
| Django 獲取字段值，並組合完整 URL |
| 完整 URL: /media/uploads/user_photo.jpg |
+------------------------------------------------------+
|
v
4. 查找文件 (檔案系統)
+------------------------------------------------------+
| Django 根據配置的 MEDIA_ROOT 找到實際存放路徑： |
| MEDIA_ROOT = BASE_DIR / 'media' |
| 實際檔案位置： BASE_DIR / media / uploads / user_photo.jpg |
+------------------------------------------------------+
|
v
5. 回傳檔案給用戶
+-------------------------------------------+
| Django 將找到的文件內容以 HTTP 回應發送至用戶端 |
| 用戶在瀏覽器中看到圖片或其他媒體檔案。 |
+-------------------------------------------+
更簡化的數據流觀點
1. 用戶請求 `/media/uploads/user_photo.jpg`
|
v
2. Django 核對 URL 前綴是否匹配 MEDIA_URL
|
v
3. 從資料庫查詢模型字段（例如：`user.profile.photo`）
|
v
4. 根據 MEDIA_ROOT 查找檔案在檔案系統中的位置
|
v
5. 返回檔案內容至用戶端瀏覽器
總結
settings.py的配置：MEDIA_URL定義媒體文件的 URL 前綴。MEDIA_ROOT定義媒體文件的存儲路徑。
urls.py的設定：- 使用
static()函數將 URL 前綴與伺服器文件系統映射。 - 僅在
DEBUG = True的開發模式下啟用，避免生產環境使用。
- 使用
- 開發環境：
- Django 內建伺服器能處理媒體檔案請求，方便快速測試。
- 生產環境：
- 媒體檔案由專業 Web 伺服器處理，提高效能與安全性。
了解這些步驟與邏輯後，處理 Django 專案中的媒體檔案應不再是一個難題！