深入理解 Django 中的自定義 404 views 函數處理解析
更新日期： 2025 年 1 月 1 日
本文為 Django + Vue 前後端分離解析，第 9 篇：
- 前後端分離的 404 錯誤處理：步驟指南
- 正常網頁與 API 接口：新手指南
- GraphQL 與 REST：理解新時代的 API 設計
- 為什麼自定義 404 頁面需要同時支持 API 和 HTML：新手指南
- 前後端分離中的路由與錯誤處理：新手指南
- 設計後端 API 的 404 錯誤處理：新手指南
- 前端與後端的 HTTP 請求與響應協議
- Django 中自定義 404 專案架構的最佳實踐
- 深入理解 Django 中的自定義 404 views 函數處理解析 👈 所在位置
- Django 的 handler404：自定義 404 錯誤頁面的核心
- Django 的 render 函數與 status 參數：為什麼重要？
- 使用 Accept 判斷請求格式：如何實現靈活的錯誤處理？
- 使用 Esbuild 搭建 Vue 開發環境的指南
- 新手入門：TailwindCSS 與 DaisyUI 的整合指南
- Django 靜態文件管理：static 與 staticfiles 完整指南
- 使用 WhiteNoise 簡化 Django 靜態文件管理：新手入門指南
- Vue 與 Django 整合：從編輯到部署的完整指南
- Django 與 Vue 的專案目錄與設計流程指南
- Django + Vue 前後端分離架構：後端路由渲染解析
- Vue 3 應用的主入口詳解：如何初始化應用
- 探索 Vue 應用的根組件：App.vue 的角色與設計
- Vue.js 單頁應用（SPA）邏輯與運作流程詳解
- 新手指南：使用 Axios 實現高效的 HTTP 請求
- 在 Vue 中處理 404 錯誤組件（component）設計：新手指南
- Vue Router 新手指南：設置 404 錯誤頁面
當用戶訪問網站上一個不存在的頁面時，服務器通常會返回 HTTP 404 錯誤頁面。
在 Django 框架中，我們可以通過編寫自定義的 404 處理函數（如 custom_404_view），為 API 請求和普通瀏覽器請求，返回不同的錯誤響應。
以下是我們將要分析的代碼：
from django.http import JsonResponse
from django.shortcuts import render
def custom_404_view(request, exception):
if "application/json" in request.headers.get("Accept", ""):
return JsonResponse({
"error": "Page not found",
"status_code": 404,
"detail": "The requested URL was not found on this server."
}, status=404)
else:
return render(request, "404.html", status=404)
本文將帶你逐步拆解這段代碼的邏輯和作用，幫助新手快速掌握其核心概念。
代碼詳解
模塊導入
from django.http import JsonResponse
from django.shortcuts import renderJsonResponse：用於返回 JSON 格式的 HTTP 響應，特別適合 API 或前後端分離應用。render：用於渲染 HTML 模板並生成 HTTP 響應，常用於返回動態網頁。
自定義函數 custom_404_view 的定義
def custom_404_view(request, exception):request：包含用戶發送的 HTTP 請求數據，例如 URL、標頭等。exception：錯誤對象，表示具體的錯誤類型或原因。在此處用於捕獲 404 錯誤。
該函數根據請求類型（普通請求或 API 請求）動態返回不同的響應內容。
判斷請求類型
if "application/json" in request.headers.get("Accept", ""):如何判斷請求是 API 還是普通瀏覽器請求？
request.headers是什麼？- 它是一個類似字典的對象，包含了所有的 HTTP 標頭信息。
- 每個標頭以鍵值對的形式存儲，例如：
{ "Accept": "application/json", "User-Agent": "PostmanRuntime/7.29.0" }
Accept標頭的作用Accept標頭由客戶端提供，指定希望獲取的響應格式。application/json：客戶端希望獲取 JSON 數據（通常是 API 客戶端）。text/html：客戶端希望獲取 HTML 頁面（通常是瀏覽器）。
- 代碼解釋
request.headers.get("Accept", "")：從請求中獲取Accept值，如果不存在則返回默認值""。if "application/json" in ...：檢查Accept是否包含"application/json"，以判斷是否為 API 請求。
返回 JSON 響應
return JsonResponse({
"error": "Page not found",
"status_code": 404,
"detail": "The requested URL was not found on this server."
}, status=404)
- API 響應的格式
- 返回 JSON 結構化數據，包含錯誤的詳細信息：
error：錯誤類型。status_code：HTTP 狀態碼。detail：錯誤的具體描述。
- 示例：
- 返回 JSON 結構化數據，包含錯誤的詳細信息：
{
"error": "Page not found",
"status_code": 404,
"detail": "The requested URL was not found on this server."
}status=404- 明確指定 HTTP 響應的狀態碼為 404。
- 適用場景
- 當前端應用（如 React 或 Vue）通過 API 請求錯誤的路徑時，返回 JSON 格式的錯誤信息，方便前端解析和展示。
返回 HTML 模板
else:
return render(request, "404.html", status=404)- HTML 響應的設計
- 如果
Accept標頭未包含"application/json"（例如瀏覽器請求），返回一個友好的 HTML 錯誤頁。 - 渲染模板
"404.html"，生成完整的 HTML 響應。
- 如果
- 模板文件的位置
- 模板文件應放置在對應 App 的
templates/資料夾下。例如：
- 模板文件應放置在對應 App 的
project/
├── core/
│ ├── templates/
│ │ └── 404.html
- 適用場景
- 當用戶通過瀏覽器直接訪問不存在的頁面時，顯示美觀的錯誤頁面，例如：
<html>
<body>
<h1>404 - Page Not Found</h1>
<p>Sorry, the page you are looking for does not exist.</p>
<a href="/">Return to Home</a>
</body>
</html>執行流程總結
- 用戶請求一個不存在的路徑，Django 自動觸發
custom_404_view。 - 檢查請求的
Accept標頭：- 如果包含
"application/json"，返回 JSON 格式的錯誤信息。 - 否則，渲染
404.html模板，返回 HTML 錯誤頁。
- 如果包含
- 設置 HTTP 狀態碼為 404，告知客戶端資源未找到。
使用場景分析
- API 應用
- 如果應用是前後端分離架構，返回 JSON 格式的錯誤信息可以幫助前端程式處理錯誤。
- 例如：
- 前端可以根據
status_code顯示不同的錯誤提示。 - 錯誤信息可以用於日誌記錄或調試。
- 前端可以根據
- 普通網站
- 為瀏覽器請求設計友好的 HTML 錯誤頁，提高用戶體驗。
- 錯誤頁面可以包含返回首頁的按鈕、聯繫方式等信息。
總結
這段代碼實現了一個靈活的自定義 404 錯誤處理函數，兼容 API 請求和普通瀏覽器請求：
- API 請求：返回結構化的 JSON 數據，方便程式處理。
- 普通請求：渲染 HTML 模板，提供直觀的錯誤提示。
通過這種方式，我們可以根據應用需求，為不同類型的用戶提供適合的錯誤響應。