Cloudflare CDN 完整教學:5 步驟從註冊到進階設定

Cloudflare CDN 完整教學:5 步驟從註冊到進階設定
想讓網站速度提升 50% 以上,同時獲得免費的 DDoS 防護和 SSL 憑證?Cloudflare CDN 是全球最多網站使用的 CDN 服務,超過 20% 的網站都透過 Cloudflare 加速。本文將手把手教你從註冊帳號到進階設定,即使是技術新手也能在 30 分鐘內完成設定。
急著設定 Cloudflare?如果你希望由專業團隊協助處理,可以預約免費諮詢,我們幫你快速完成設定。
Cloudflare 是什麼?
Cloudflare 是全球最大的 CDN(內容傳遞網路)服務商之一,成立於 2009 年,目前在全球超過 300 個城市部署了邊緣節點。除了 CDN 加速功能外,Cloudflare 還提供 DDoS 防護、WAF(Web 應用程式防火牆)、免費 SSL 憑證等安全功能。
想了解更多 CDN 的基礎概念和運作原理,可以參考我們的完整指南。
描述:Cloudflare 全球網路節點分布圖,以世界地圖為底,標示 300+ 個邊緣節點位置,並以線條連接顯示網路覆蓋範圍 構圖:全幅橫向、深藍色底、綠色/橙色節點標記 -->
Cloudflare 的核心優勢
根據我們協助客戶導入 Cloudflare 的經驗,主要優勢包括:
| 優勢 | 說明 |
|---|---|
| 完全免費方案 | 免費版已包含 CDN、SSL、基礎 DDoS 防護 |
| 設定簡單 | 不需要修改程式碼,只需更換 DNS |
| 全球節點覆蓋 | 300+ 城市,台灣有多個 PoP 節點 |
| 自動 HTTPS | 免費 SSL 憑證,一鍵啟用 |
| 即時生效 | 設定後通常 5 分鐘內生效 |
免費方案包含什麼?
很多人不知道,Cloudflare 免費方案其實相當完整:
包含的功能:
- 無限量 CDN 流量(沒有頻寬上限)
- 無限量 DDoS 防護(包含 Layer 3/4/7)
- Universal SSL 免費憑證
- 基本快取功能
- 5 條 Page Rules
- 基礎 WAF 規則
免費版的限制:
- 無法自訂 SSL 憑證
- 進階 WAF 規則需付費
- 圖片優化功能需 Pro 方案
- 優先客服支援需付費
想了解更多 Cloudflare 費用與各方案差異,可以參考我們的費用指南。
5 步驟完成 Cloudflare 設定
Step 1:建立 Cloudflare 帳號
- 前往 cloudflare.com
- 點擊「Sign Up」註冊帳號
- 輸入 Email 和密碼
- 完成 Email 驗證
注意事項:
- 建議使用公司 Email 註冊,方便日後帳號管理
- 密碼建議至少 12 位,包含大小寫與數字
- 建議開啟二階段驗證(2FA)提升安全性
描述:Cloudflare 註冊頁面截圖,標示 Email 輸入框、密碼欄位與 Sign Up 按鈕位置 構圖:網頁截圖、標註箭頭指向重點區域 -->
Step 2:新增網站
登入後,點擊「Add a Site」新增網站:
- 輸入網站網域(例如:example.com)
- 選擇方案(Free 即可開始)
- Cloudflare 會自動掃描現有 DNS 記錄
- 確認 DNS 記錄是否正確
常見問題:
- 只需輸入根網域,不需要加 www 或 https
- 免費方案沒有網站數量限制
- 子網域會自動包含在內
Step 3:設定 DNS 記錄
Cloudflare 會自動匯入現有的 DNS 記錄,但你需要確認以下事項:
| 記錄類型 | 名稱 | 內容 | Proxy 狀態 |
|---|---|---|---|
| A | @ | 你的伺服器 IP | 開啟(橘雲) |
| A | www | 你的伺服器 IP | 開啟(橘雲) |
| CNAME | @ | 你的主機名稱 | 開啟(橘雲) |
| MX | @ | 郵件伺服器 | 關閉(灰雲) |
Proxy 模式(橘色雲朵)vs DNS Only(灰色雲朵):
- 橘雲(Proxied):流量經過 Cloudflare,享有 CDN 加速和安全防護
- 灰雲(DNS Only):只使用 DNS 解析,不經過 Cloudflare
建議設定:
- 網站主要記錄(A、AAAA、CNAME)→ 開啟 Proxy
- 郵件相關(MX、SPF、DKIM)→ 使用 DNS Only
- FTP、SSH 等服務 → 使用 DNS Only
Step 4:更換 DNS 伺服器
這是最關鍵的一步。Cloudflare 會提供兩組 Nameserver:
例如:
alice.ns.cloudflare.com
bob.ns.cloudflare.com
你需要到網域註冊商(如 GoDaddy、Namecheap、PChome)更換 Nameserver:
- 登入網域註冊商後台
- 找到 DNS 管理或 Nameserver 設定
- 將原本的 Nameserver 改為 Cloudflare 提供的兩組
- 儲存設定
各主要註冊商設定位置:
- GoDaddy:My Products → Domain → DNS → Manage Nameservers
- Namecheap:Domain List → Manage → Nameservers
- Gandi:Domain → Nameservers → External
Step 5:等待生效與驗證
DNS 更換後,通常需要等待 5 分鐘至 24 小時生效(大多數在 1 小時內)。
驗證方法:
- Cloudflare 後台:查看網站狀態是否顯示「Active」
- 命令列檢查:
nslookup example.com # 應該顯示 Cloudflare IP - HTTP Header 檢查:
curl -I https://example.com # 應該看到 cf-ray 標頭
DNS 設定詳解
Proxy 模式的運作原理
當 Proxy 模式開啟(橘雲)時:
- 使用者查詢你的網域,DNS 回傳 Cloudflare IP
- 使用者連線到最近的 Cloudflare 節點
- Cloudflare 檢查快取,若有則直接回傳
- 若無快取,Cloudflare 向你的 Origin Server 取得內容
- 回傳給使用者,並快取供下次使用
好處:
- 隱藏真實伺服器 IP,增加安全性
- 享有 CDN 快取加速
- 獲得 DDoS 防護
- 可使用免費 SSL 憑證
描述:Cloudflare Proxy 模式流程圖,顯示使用者請求 → Cloudflare Edge → Origin Server 的資料流向,包含快取命中與未命中的兩種路徑 構圖:左到右流程圖、三個主要節點、箭頭標示資料流向 -->
子網域設定技巧
對於多個子網域,可以使用萬用字元(Wildcard):
| 記錄類型 | 名稱 | 內容 | 說明 |
|---|---|---|---|
| A | * | 伺服器 IP | 匹配所有子網域 |
| A | api | API 伺服器 IP | 特定子網域 |
| A | staging | 測試伺服器 IP | 測試環境 |
注意: 免費方案的萬用字元 SSL 有限制,如果需要多層子網域(如 a.b.example.com),需要升級到付費方案。
SSL/TLS 設定
加密模式選擇
Cloudflare 提供四種 SSL/TLS 加密模式:
| 模式 | 說明 | 建議使用情境 |
|---|---|---|
| Off | 不加密 | 不建議使用 |
| Flexible | 使用者到 Cloudflare 加密,Cloudflare 到 Origin 不加密 | Origin 沒有 SSL 憑證時的暫時方案 |
| Full | 全程加密,但不驗證 Origin 憑證 | Origin 有自簽憑證 |
| Full (Strict) | 全程加密,驗證 Origin 憑證 | 強烈建議,最安全 |
我們的建議: 始終使用 Full (Strict) 模式,確保端到端加密。如果你的伺服器沒有 SSL 憑證,可以使用 Cloudflare 的 Origin CA 免費取得。
免費 SSL 憑證
Cloudflare 提供兩種免費 SSL 憑證:
- Universal SSL:自動頒發給你的網域,覆蓋根網域和一層子網域
- Origin CA:安裝在你的伺服器上,建立與 Cloudflare 之間的加密連線
啟用 Universal SSL:
- 位置:SSL/TLS → Edge Certificates
- 預設已啟用,不需額外設定
- 憑證有效期 3 個月,自動續期
強制 HTTPS 設定
為確保所有流量都使用 HTTPS,建議開啟以下設定:
- Always Use HTTPS:SSL/TLS → Edge Certificates → Always Use HTTPS → On
- Automatic HTTPS Rewrites:SSL/TLS → Edge Certificates → Automatic HTTPS Rewrites → On
- HSTS(進階):SSL/TLS → Edge Certificates → HTTP Strict Transport Security
設定過程卡關?預約免費諮詢,讓我們幫你處理。
快取設定優化
快取層級選擇
Cloudflare 提供三種快取層級:
| 層級 | 說明 | 適用情境 |
|---|---|---|
| No query string | 忽略 URL 參數 | 靜態網站 |
| Ignore query string | 相同 URL 不同參數視為相同 | 大多數網站 |
| Standard | URL 參數不同則分別快取 | 動態內容較多的網站 |
設定位置: Caching → Configuration → Caching Level
瀏覽器快取 TTL
Browser Cache TTL 決定瀏覽器快取資源的時間:
| 資源類型 | 建議 TTL |
|---|---|
| 圖片 | 1 年 |
| CSS/JS | 1 年(搭配版本號) |
| HTML | 不快取或短時間 |
| API 回應 | 不快取 |
設定位置: Caching → Configuration → Browser Cache TTL
Page Rules 設定
Page Rules 可以針對特定 URL 路徑設定不同的快取規則。免費方案有 3 條規則限制。
常用設定範例:
1. 靜態資源永久快取
URL: *example.com/static/*
設定: Cache Level → Cache Everything, Edge Cache TTL → 1 month
2. API 路徑不快取
URL: *example.com/api/*
設定: Cache Level → Bypass
3. 登入頁面不快取
URL: *example.com/login*
設定: Cache Level → Bypass, Security Level → High
清除快取方法
當網站更新內容後,可能需要清除快取:
- 清除全部快取:Caching → Configuration → Purge Everything
- 清除特定 URL:Caching → Configuration → Custom Purge
- 透過 API:適合整合到 CI/CD 流程
建議: 避免頻繁清除全部快取,改用特定 URL 清除或設定適當的快取標頭。
描述:Cloudflare 快取設定介面截圖,標示 Caching Level、Browser Cache TTL 和 Purge Cache 按鈕位置 構圖:後台截圖、紅框標註重點設定區域 -->
安全性設定
WAF 基本設定
Web Application Firewall(WAF)可以阻擋常見的網路攻擊:
免費方案包含的防護:
- OWASP Core Rule Set(基礎)
- Cloudflare Managed Ruleset(基礎)
- Rate Limiting(有限制)
設定位置: Security → WAF
建議設定:
- 將 Security Level 設為 Medium 或 High
- 開啟 Challenge Passage:設定通過驗證後的有效時間
- 檢視 Firewall Events:定期查看被阻擋的請求
Bot 防護
Cloudflare 的 Bot Fight Mode 可以識別並阻擋惡意機器人:
設定位置: Security → Bots → Bot Fight Mode → On
注意事項:
- 可能會誤擋合法的爬蟲(如搜尋引擎)
- 建議將 Google、Bing 等搜尋引擎加入白名單
- 監控 Firewall Events 確認沒有誤判
DDoS 防護
Cloudflare 的 DDoS 防護是免費且自動啟用的:
- Layer 3/4 防護:自動偵測並阻擋網路層攻擊
- Layer 7 防護:透過智慧演算法識別異常請求
- Unmetered Mitigation:無論攻擊規模多大,都不額外收費
想了解更多 CDN 與 DDoS 防護的運作原理,可以參考我們的專文。
效能優化設定
Auto Minify
自動壓縮 HTML、CSS、JavaScript,減少檔案大小:
設定位置: Speed → Optimization → Content Optimization → Auto Minify
建議: 全部開啟(HTML、CSS、JavaScript)
注意: 如果網站使用複雜的 JavaScript 框架,開啟後需測試功能是否正常。
Brotli 壓縮
Brotli 是比 Gzip 更高效的壓縮演算法,可減少 15-25% 的傳輸量:
設定位置: Speed → Optimization → Content Optimization → Brotli → On
Rocket Loader
自動優化 JavaScript 載入順序,提升頁面載入速度:
設定位置: Speed → Optimization → Content Optimization → Rocket Loader
注意事項:
- 可能與某些 JavaScript 框架(如 React、Vue 的 SSR)不相容
- 建議開啟後進行完整測試
- 如果發現問題,可以透過 data-cfasync="false" 排除特定 script
Early Hints(HTTP 103)
提前告知瀏覽器需要預載的資源:
設定位置: Speed → Optimization → Content Optimization → Early Hints → On
效果: 可縮短約 30% 的資源載入時間。
Argo Smart Routing(付費)
Argo 使用 Cloudflare 的私有網路骨幹,找出最快的路由路徑:
- 平均可提升 30% 的效能
- 費用:每 GB $0.10
- 適合對延遲敏感的應用
是否值得? 如果你的網站主要使用者在台灣,而伺服器在美國或歐洲,Argo 可以顯著改善延遲。但如果伺服器已在亞洲,效益較小。
常見問題與疑難排解
網站變慢怎麼辦?
可能原因與解決方案:
-
Rocket Loader 不相容
- 關閉 Rocket Loader
- 或針對特定 script 加上 data-cfasync="false"
-
快取設定不當
- 確認靜態資源有正確快取
- 檢查 Cache-Control 標頭
-
SSL 模式設定錯誤
- 確認使用 Full (Strict) 模式
- 確認 Origin Server 有正確的 SSL 憑證
-
Origin Server 回應慢
- CDN 無法改善 Origin 的處理速度
- 需要優化後端程式或資料庫
SSL 憑證錯誤
常見錯誤與解決方案:
| 錯誤 | 原因 | 解決方案 |
|---|---|---|
| ERR_SSL_VERSION_OR_CIPHER_MISMATCH | SSL 模式設定錯誤 | 確認 SSL 模式設定正確 |
| 525 SSL Handshake Failed | Origin 憑證問題 | 安裝有效的 SSL 憑證 |
| 526 Invalid SSL Certificate | Origin 憑證無效 | 使用 Cloudflare Origin CA |
| Mixed Content | 頁面混用 HTTP/HTTPS | 開啟 Automatic HTTPS Rewrites |
快取未生效
檢查步驟:
-
確認 Proxy 已開啟:DNS 記錄顯示橘色雲朵
-
檢查 Cache Status:使用開發者工具查看 cf-cache-status 標頭
- HIT:快取命中
- MISS:快取未命中
- DYNAMIC:動態內容不快取
- BYPASS:被規則略過
-
檢查快取標頭:確認 Origin Server 沒有設定 Cache-Control: no-cache
-
等待快取建立:第一次請求一定是 MISS,需要多請求幾次
Cloudflare 付費方案值得嗎?
方案比較
| 功能 | Free | Pro ($20/月) | Business ($200/月) |
|---|---|---|---|
| CDN 流量 | 無限 | 無限 | 無限 |
| DDoS 防護 | ✓ | ✓ | ✓ |
| SSL 憑證 | Universal | Universal + 自訂 | Universal + 自訂 |
| WAF 規則 | 基礎 | 進階 | 完整 |
| 圖片優化 | ✗ | ✓ (Polish, Mirage) | ✓ |
| Page Rules | 3 條 | 20 條 | 50 條 |
| 客服支援 | 社群 | Email + Chat | |
| SLA | ✗ | ✗ | 100% |
何時該升級?
建議升級到 Pro 的情境:
- 需要圖片優化功能(Polish、Mirage)
- 需要更多 Page Rules
- 需要進階 WAF 規則
- 想要 Email 客服支援
建議升級到 Business 的情境:
- 需要 100% SLA 保證
- 需要完整的 WAF 規則集
- 需要 24/7 客服支援
- 有合規需求(如 PCI-DSS)
想了解更多 CDN 費用與方案選擇,可以參考我們的費用指南。
整合其他服務
WordPress + Cloudflare
WordPress 使用者可以安裝官方外掛獲得更好的整合:
- 安裝 Cloudflare 官方外掛
- 連結 Cloudflare 帳號
- 啟用 Automatic Platform Optimization(APO)
APO 效果:
- WordPress 專屬快取優化
- HTML 頁面也能快取
- 費用:$5/月
電商網站注意事項
電商網站使用 Cloudflare 需特別注意:
- 購物車頁面:使用 Page Rule 設定 Bypass Cache
- 結帳流程:確保不被快取
- 會員系統:動態內容需正確設定
- 金流回調:確認 IP 白名單設定
搭配其他 CDN
Cloudflare 可以與其他 CDN 搭配使用:
- Cloudflare 在前:主要處理安全防護和快取
- 專業 CDN 在後:針對影音串流或大檔案分發
了解更多 CDN 廠商的差異與選擇。
結論:開始你的 Cloudflare 之旅
完成本文的設定後,你的網站應該已經:
- 全球 CDN 加速生效
- 免費 SSL 憑證啟用
- 基礎 DDoS 防護開啟
- 快取設定完成優化
下一步建議:
- 使用 GTmetrix 測試網站速度
- 監控 Cloudflare Analytics 了解流量狀況
- 定期檢視 Firewall Events 確認安全
- 進一步優化 CDN 設定(參考 CDN 設定優化教學)
想讓專業團隊幫你設定?預約 CDN 評估,我們幫你優化網站速度。CloudInsight 已協助超過 50 家企業完成 Cloudflare 導入,平均提升網站速度 45% 以上。
常見問題 FAQ
Cloudflare 免費版真的夠用嗎?
對於大多數中小型網站,Cloudflare 免費版已經足夠。免費版包含無限 CDN 流量、DDoS 防護和 SSL 憑證,這些功能在其他 CDN 通常需要付費。如果你不需要進階 WAF 規則、圖片優化或企業級支援,免費版就能滿足需求。
更換 Nameserver 會影響 Email 嗎?
不會,只要正確設定 MX 記錄。Cloudflare 會自動匯入你現有的 DNS 記錄,包括 MX 記錄。但請注意,MX 記錄應該使用「DNS Only」模式(灰雲),不要開啟 Proxy。
Cloudflare 會影響 SEO 嗎?
Cloudflare 對 SEO 有正面影響。更快的網站速度是 Google 排名因素之一,使用 CDN 可以改善 Core Web Vitals 分數。Cloudflare 對搜尋引擎爬蟲友善,不會阻擋正常的索引行為。
可以只用 Cloudflare 的 DNS 不用 CDN 嗎?
可以。將所有記錄設定為「DNS Only」(灰雲),就只使用 Cloudflare 的 DNS 服務。Cloudflare DNS 是全球最快的公共 DNS 之一,即使不使用 CDN 功能也很有價值。
Cloudflare 和 AWS CloudFront 可以一起用嗎?
可以,但需要仔細規劃架構。常見做法是讓 Cloudflare 處理安全防護和全球 CDN,CloudFront 專注於與 AWS 服務的整合。詳細的架構設計建議預約架構諮詢討論。
相關文章
AWS CloudFront 教學:7 步驟完成 CDN 設定與優化
AWS CloudFront CDN 完整設定教學!從建立 Distribution、設定 Origin 到整合 S3 與 EC2,詳解步驟與最佳實踐,打造高效能網站架構。
CDNCDN 與 DDoS 防護:3 層機制保護你的網站安全
CDN 如何防護 DDoS 攻擊?完整解析 CDN 的安全機制,從流量清洗、WAF 到 Bot 防護,了解如何透過 CDN 強化網站安全性。
CDNCDN 設定優化教學:8 招讓網站速度提升 50%
CDN 設定與優化完整教學!從快取策略、壓縮設定到效能監控,一步步教你正確設定 CDN,讓網站速度提升 50% 以上。