網站串接 Bunny CDN 完整教學：加速網站、減輕主機負擔、流量暴增也更穩
先說結論：Bunny CDN 不是「一定要用」，但如果你有以下任一狀況，很值得評估。
- 網站圖片多、頁面重，想要更快的載入速度
- 有時會突然湧入大量訪客（例如打廣告、上新聞、被轉發）
- 課程網站同時上線的人變多，主機壓力上升
- 想把靜態資源交給 CDN 處理，讓主機專心處理會員、訂單、資料庫
為什麼 CDN 能加快網站？（用人話講清楚）
沒有 CDN 的時候，訪客每次開你的網站，圖片、CSS、JS 都要從你的主機抓。就算 1,000 個人看同一張圖片，你的主機也得回應 1,000 次。
用了 Bunny CDN 之後，靜態檔案會被快取在 Bunny 的節點上，訪客會從「離他最近的節點」下載內容，主機不用一直被同樣的請求打爆，網站自然會更順、更穩。
用 1 萬人流量暴增做例子：CDN 怎麼幫你分擔壓力？
想像你投放 Meta 廣告，今天表現很好，短時間湧入 10,000 人到你的著陸頁。每個人都要載入圖片、版面樣式、腳本檔案。
- 沒有 CDN：所有圖片、CSS、JS 的請求都打到你的主機，主機 CPU、I/O、頻寬瞬間拉滿，最常見就是「突然變很慢」、甚至 504 超時
- 有 CDN：大部分靜態請求被 Bunny 節點吃掉，你的主機只需要處理真正的動態內容（登入、會員、購物車、下單），穩定度大幅提升
順便補充：課程影片建議用 Bunny 串流（不要放主機硬扛）
如果你有「很多學員同時觀看課程影片」的情境，影片串流會比圖片更吃頻寬與連線資源。把影片交給 Bunny 這種串流/儲存方案，會比直接讓主機提供影片更安全、也更穩定。本文主要教 CDN（網站靜態資源加速），但你可以把它想成同一個方向：把「大量重複下載的內容」交給專門做分發的服務。
開始前你要準備什麼？
- 一個 Bunny 帳號
- 你的網域管理權限（例如你用 Gandi 管理 DNS）
- WordPress 後台可安裝外掛（本文用 Bunny 官方外掛）
- 建議先完成基礎快取（例如你本來就有使用快取外掛也沒關係，本文不教用快取外掛串 CDN，只教 Bunny 官方外掛）
第 1 步：到 Bunny 註冊帳號並登入後台
- 前往 bunny.net 註冊帳號（使用 Email 註冊）
- 完成信箱驗證後登入 Bunny 控制台
- 進入後台後，你會看到各種產品選項，本文要做的是 CDN，所以接下來建立「Pull Zone」
第 2 步：建立 Bunny CDN 的 Pull Zone
Pull Zone 的概念很簡單：你提供「原站網址（你的網站）」當作來源，Bunny 會去抓取你的靜態資源並快取，之後訪客就從 Bunny 的節點下載。
- 在 Bunny 後台找到 CDN（或 Pull Zones）相關入口
- 點選新增 Pull Zone（Add Pull Zone）
- 填寫 Pull Zone Name（例如：mxpx 或 mxpxcdn，這只是後台辨識用的名稱）
- 填寫 Origin URL（原站來源）
- 通常填你的網站主網域，例如 https://mxpx.tw
- 如果你有特定靜態網域或來源，也可以填對應來源（多數人填主站即可）
- 儲存建立
Pricing zones 要選哪些區域？
原則是：選你「主要訪客」所在區域就好。區域越多，涵蓋越廣，但費用也會依區域流量計價。你可以先保守選擇，再依實際流量調整。
- 你的主要客群在台灣/亞洲：建議至少選 Asia & Oceania
- 若你有海外客群（例如歐美也很多）：再加選 Europe、North America
- 中東非洲、南美通常費率較高，如果你幾乎沒有那邊的客群，可以先不選；之後真的有需求再開
提醒：即使你關閉某些區域，當那些區域有人訪問時，流量可能會被導向「最近的可用區域」。你要做的是平衡「費用」與「使用者體驗」。
第 3 步：設定自訂網域（子網域）給 CDN 使用
這一步是讓你的 CDN 網址看起來像自己的網域，例如：
- cdn.mxpx.tw
- static.mxpx.tw
- media.mxpx.tw
你要用哪個子網域名稱完全可以自行命名。本文用 cdn.mxpx.tw 當範例，你也可以換成你自己的網域與命名。
- 回到 Bunny 的 Pull Zone 設定頁
- 找到 Custom Hostname（或 Add Hostname / Custom Domains）
- 新增你的子網域，例如：cdn.mxpx.tw
- Bunny 會提供一個目標網域，通常類似：mxpx.b-cdn.net
- 接下來到你的網域商（本文以 Gandi 為例）做 DNS 設定
第 4 步：到網域商新增 CNAME（以 Gandi 為例）
在 Gandi 後台設定 DNS 時，通常會需要建立 CNAME，讓 cdn.mxpx.tw 指向 Bunny 提供的網域（例如 mxpx.b-cdn.net）。
以 Gandi 為例，常見要注意的一點是：目標值有時需要在最後面加上一個「點」：
- mxpx.b-cdn.net.
這是 Gandi 後台的格式習慣，不代表所有網域商都一樣。其他網域商若沒有要求「結尾點」，就照該平台介面規則填寫即可。
Gandi CNAME 範例（請用你的實際資料替換）
| 項目 | 範例 |
|---|---|
| Record Type | CNAME |
| Name / Host | cdn |
| Target / Value | mxpx.b-cdn.net. |
| TTL | 預設即可 |
設定完成後，DNS 生效可能需要幾分鐘到數小時不等（看網域商與快取狀況）。
第 5 步：安裝 Bunny 官方 WordPress 外掛並連線帳號
你前面提到的狀況很關鍵：Bunny 官方外掛有一種方式是「直接在外掛介面登入 Bunny 帳號」，登入後會自動連線、抓取你後台的 Zone 資料，不需要手動輸入一長串 API Key（實作上真的方便很多）。
- 到 WordPress 後台 → 外掛 → 安裝外掛
- 搜尋 Bunny（Bunny.net）官方外掛並安裝啟用
- 進入 Bunny 外掛設定頁
- 使用外掛介面登入你的 Bunny 帳號（依外掛引導操作）
- 登入成功後，外掛通常會列出你已建立的 Pull Zone，選取你要使用的那一個
- 啟用 CDN rewriting（讓圖片、CSS、JS 變成 cdn 子網域）
外掛選項解釋：Add CORS Headers 要不要開？
CORS（跨來源資源共享）主要跟「跨網域載入資源」有關。一般純網站靜態資源（圖片、CSS、JS）多數情況不一定需要特別開，但如果你有以下情境，可以考慮開啟：
- 你的資源會被不同網域的頁面載入（例如你有多網域、子站、外部嵌入）
- 你遇到某些字體、腳本或特定資源被瀏覽器擋下的狀況
如果你不確定，建議先維持預設；真的遇到跨來源載入問題再開也不遲。
外掛選項解釋：Disable for Admin（管理員不走 CDN）要不要開？
這個選項的意思是：你以管理員登入後台、或登入狀態瀏覽網站時，不把內容改寫成 CDN。
- 優點：你在編輯、調整、測試時，看到的是「最原始、最即時」的資源，不容易被 CDN 快取干擾
- 缺點：你登入狀態下看到的速度可能不如訪客（因為訪客有走 CDN）
我通常建議：如果你很常在調整外觀、改 CSS、改版面，開啟這個選項會比較省事；如果你希望自己也能用訪客角度驗證 CDN 效果，就先關掉，用無痕視窗或登出狀態檢查也可以。
第 6 步：確認是否成功（最簡單的檢查方式）
- 用無痕視窗打開你網站任一頁
- 在前台對圖片右鍵（或新分頁開啟圖片）查看圖片網址
- 如果網址變成 https://cdn.你的網域/… 或出現 b-cdn.net（視設定而定），代表改寫成功
- 你也可以打開瀏覽器開發者工具（Network）查看 CSS/JS 是否走 CDN 網域
第 7 步：啟用後的建議設定與維護習慣
- 改版或更新大量圖片後：記得在 Bunny 後台或外掛中 Purge Cache（清除快取），避免訪客看到舊檔
- 若你更新 CSS/JS 後前台沒變：先 Purge Cache，再清理瀏覽器快取
- 若你有 HTTPS：確保 Bunny 自訂網域也有正確啟用 SSL（通常後台可設定）
常見問題排除
1) 圖片沒有變成 CDN 網址
- 先用無痕視窗測試（避免你自己的快取干擾）
- 確認外掛已選對 Pull Zone 並啟用改寫
- 確認 DNS 的 CNAME 已生效（有時需要一些時間）
- 清除 Bunny 快取與網站快取後再測一次
2) 前台圖片/背景圖不顯示
若你使用頁面編輯器（例如 Elementor），有些背景圖是用 CSS 載入，可能會牽涉到延遲載入、快取或改寫規則。做法是：
- 先暫時關閉「針對 CSS 背景圖片的延遲載入」之類設定，觀察是否恢復
- 清除 Bunny 快取後再測試
- 確認你的 CDN 網域（cdn.xxx）有正確 SSL，避免混合內容被瀏覽器擋下
3) 我之後不想用 CDN 了怎麼辦？
很簡單：在 Bunny 外掛關閉 CDN 改寫/停用外掛即可，網站會回到原本從主機載入靜態資源的方式。若你有設定 DNS 的 cdn 子網域，也可以保留或移除都行（視你未來是否可能再啟用）。
結語：Bunny CDN 值不值得用？用你的情境來判斷
如果你目前網站很輕、圖片不多、流量也穩定，其實不一定要急著上 CDN。
但如果你有「流量可能突然放大」的情境（打廣告、活動、課程開賣），或你想讓網站在尖峰時段更穩，Bunny CDN 的核心價值是把大量重複的靜態請求分擔掉，讓你的主機不會被同一件事情一直操，網站體感速度與穩定度也更容易維持。
建議你先用最小成本的方式上線測試：先選主要區域、先用一個 cdn 子網域，跑一週看速度與主機負載，再決定要不要擴大區域或搭配更多功能。
如果你會看到這裡，代表你對「把事情做得更有系統」其實是有興趣的。
我把自己一路摸索、嘗試、踩過雷後整理出的起步經驗，整理成一份免費指引，給正在思考下一步的人。
