使用 Caddyfile 建立自訂 502 錯誤頁面
在實際應用中，當反向代理的後端服務發生問題時，可能會產生 502 錯誤。為了讓最終用戶看到友善的錯誤頁面，我們可以透過 Caddy 的 handle_errors 指令，根據錯誤狀態碼轉導到自訂頁面。以下將介紹如何利用 Caddyfile 設定自訂 502 錯誤頁面。
基本概念
在 Caddyfile 中，我們常見的使用情境包括：
- 將 HTTP 請求重導向至 HTTPS，確保連線安全。
- 使用 reverse_proxy 將流量代理至後端服務。
- 當後端返回 502 狀態碼時，利用 handle_errors 502 指令捕捉該錯誤，並透過 rewrite 轉導到指定的錯誤頁面，再以 file_server 提供靜態內容。
範例設定
以下是一份簡潔且無隱私資訊的 Caddyfile 範例，展示如何在 HTTPS 模式下設置 502 錯誤自訂頁面：
# 將 HTTP 請求重導向至 HTTPS
http://example.com {
redir https://example.com{uri}
}
# HTTPS 站台設定
https://example.com {
# 反向代理到後端服務（此處以 backend 為範例）
reverse_proxy http://backend
# 當後端回傳 502 錯誤時，觸發錯誤處理
handle_errors 502 {
# 將請求改寫到 /502.html
rewrite * /502.html
# 從 /var/www/html 目錄提供自訂錯誤頁面
file_server {
root /var/www/html
}
}
}
說明
HTTP 重導向
- 使用
redir 將所有來自 http://example.com 的請求轉導至 https://example.com，以確保用戶使用安全連線。
反向代理設定
reverse_proxy http://backend 會將所有 HTTPS 的流量代理至後端服務。這裡的 backend 可依實際環境替換為具體的後端位址。
錯誤處理
handle_errors 502 會捕捉到所有 502 狀態的錯誤。- 透過
rewrite * /502.html 指令，將請求重新導向到錯誤頁面 /502.html。
- 最後利用
file_server 指令從 /var/www/html 目錄讀取靜態頁面，呈現自訂的 502 錯誤頁面。
以上設定可依需求進一步調整，例如變更錯誤頁面的路徑或目錄。藉由這種方式，你可以有效地提升用戶體驗，讓系統在出現 502 錯誤時仍能提供清楚的提示訊息。