AWS CloudFront 教學：7 步驟完成 CDN 設定與優化
AWS CloudFront 教學：7 步驟完成 CDN 設定與優化
AWS CloudFront 是 Amazon Web Services 的 CDN 服務，與 AWS 生態系深度整合，是企業級應用的首選。本文將從基礎概念開始，帶你完成 CloudFront 的完整設定，包含 S3 靜態網站、EC2/ALB 動態應用的整合，以及效能與成本優化的最佳實踐。
需要快速完成 AWS 架構設計？預約架構諮詢，讓我們的 AWS 認證架構師協助你。
CloudFront 簡介
什麼是 AWS CloudFront？
AWS CloudFront 是 Amazon 的全球內容傳遞網路（CDN），在全球 47 個國家擁有超過 450 個邊緣節點（Edge Locations）和 13 個區域邊緣快取（Regional Edge Caches）。
想了解更多 CDN 的基礎概念和運作原理，可以參考我們的完整指南。
CloudFront 的主要特色：
| 特色 | 說明 |
|---|---|
| AWS 深度整合 | 與 S3、EC2、ALB、Lambda@Edge 無縫整合 |
| 全球覆蓋 | 450+ 邊緣節點，覆蓋六大洲 |
| 安全防護 | 內建 AWS Shield Standard，可整合 WAF |
| 彈性計費 | 按實際用量計費，沒有最低消費 |
| 即時日誌 | 可匯出至 S3、CloudWatch 分析 |
CloudFront 與其他 CDN 的差異
| 比較項目 | CloudFront | Cloudflare | Akamai |
|---|---|---|---|
| 免費方案 | 有（12 個月 1TB/月） | 有（無限流量） | 無 |
| AWS 整合 | 原生 | 需額外設定 | 需額外設定 |
| 設定複雜度 | 中等 | 簡單 | 複雜 |
| 適合場景 | AWS 用戶 | 一般網站 | 大型企業 |
想了解更多 CDN 廠商的完整比較，可以參考我們的比較文章。
描述：AWS CloudFront 全球邊緣節點分布圖，以世界地圖為底，標示 450+ 個 Edge Location 和 13 個 Regional Edge Cache 的位置 構圖：全幅橫向、AWS 深藍色底、橙色節點標記 -->
CloudFront 核心概念
在開始設定前，你需要了解 CloudFront 的四個核心概念：
Distribution（分發）
Distribution 是 CloudFront 的基本設定單位，包含了所有關於 CDN 的設定，如 Origin、快取行為、SSL 憑證等。
類型：
- Web Distribution：用於網站和 API（最常用）
- RTMP Distribution：用於串流媒體（已停止新建）
Origin（來源）
Origin 是你的內容存放位置，CloudFront 會從 Origin 取得內容並快取。
常見 Origin 類型：
- S3 Bucket（靜態內容）
- ALB/ELB（動態內容）
- EC2 Instance（直接連線）
- 自訂 Origin（任何 HTTP/HTTPS 伺服器）
- MediaStore / MediaPackage（串流內容）
Edge Location（邊緣節點）
Edge Location 是快取內容的實際位置，分布在全球各地。使用者的請求會被路由到最近的 Edge Location。
亞太區主要節點：
- 台灣：台北
- 日本：東京、大阪
- 韓國：首爾
- 香港
- 新加坡
- 澳洲：雪梨、墨爾本
Cache Behavior（快取行為）
Cache Behavior 決定 CloudFront 如何處理不同路徑的請求。
可設定項目：
- URL 路徑模式（Path Pattern）
- 允許的 HTTP 方法
- 快取策略（Cache Policy）
- Origin Request Policy
- 是否壓縮
- Lambda@Edge 觸發器
描述：CloudFront 架構圖，顯示使用者請求流程：使用者 → Edge Location → Regional Edge Cache → Origin（S3/ALB/EC2），並標示各層的功能 構圖：由上至下流程圖、四層架構、箭頭標示資料流向 -->
建立第一個 Distribution
Step 1：進入 CloudFront Console
- 登入 AWS Console
- 搜尋「CloudFront」或在服務列表中找到
- 點擊「Create Distribution」
Step 2：設定 Origin
Origin Domain： 輸入你的來源網域
- S3：選擇 S3 bucket（會自動顯示）
- ALB/EC2：輸入 DNS 名稱或 IP
Origin Path： 選填，指定特定路徑（如 /public）
Origin Access：
- Public：Origin 是公開可存取
- Origin Access Control (OAC)：限制只有 CloudFront 可存取（建議用於 S3）
- Origin Access Identity (OAI)：舊版設定，建議使用 OAC
Protocol：
- HTTPS Only（建議）
- Match Viewer
- HTTP Only（不建議）
Step 3：設定 Default Cache Behavior
Path Pattern： 預設為 *（匹配所有請求）
Compress Objects Automatically： 建議開啟
Viewer Protocol Policy：
- HTTP and HTTPS
- Redirect HTTP to HTTPS（建議）
- HTTPS Only
Allowed HTTP Methods：
- GET, HEAD（靜態內容）
- GET, HEAD, OPTIONS
- GET, HEAD, OPTIONS, PUT, POST, PATCH, DELETE（API）
Cache Key and Origin Requests：
- Cache Policy：選擇或建立快取策略
- Origin Request Policy：選擇需要傳送到 Origin 的標頭
Step 4：設定 Distribution Settings
Price Class： 決定使用哪些區域的節點
- Use All Edge Locations（最佳效能，最高成本）
- Use North America, Europe, Asia, Middle East, and Africa
- Use Only North America and Europe（最低成本）
AWS WAF： 可選擇是否整合 WAF
Alternate Domain Names (CNAMEs)： 輸入你的自訂網域
Custom SSL Certificate： 選擇 ACM 憑證
Default Root Object： 如 index.html
Step 5：建立並等待部署
點擊「Create Distribution」後，需等待 5-15 分鐘完成部署。狀態會從「In Progress」變為「Deployed」。
部署完成後，你會獲得一個 CloudFront 網域名稱（如 d1234567890.cloudfront.net），可以用來測試。
整合 S3 靜態網站
S3 + CloudFront 是最常見的靜態網站架構，適合部落格、企業官網、SPA 應用程式。
S3 Bucket 設定
1. 建立 Bucket
- 名稱建議與網域相同（如 www.example.com）
- 區域選擇接近主要使用者的地區
2. 上傳檔案
- 上傳 HTML、CSS、JS、圖片等靜態檔案
3. 不需要開啟 Static Website Hosting
- 使用 OAC 時，不需要也不建議開啟公開存取
Origin Access Control（OAC）設定
OAC 是 AWS 推薦的新方式，取代舊的 OAI：
1. 建立 OAC
- CloudFront Console → Origin Access → Create Control Setting
- 輸入名稱，其他使用預設值
2. 在 Distribution 中選擇 OAC
- Origin Access → Origin Access Control Settings
- 選擇剛建立的 OAC
3. 更新 S3 Bucket Policy CloudFront 會提供一個 Policy，複製並貼到 S3 Bucket Policy：
{
"Version": "2012-10-17",
"Statement": [
{
"Sid": "AllowCloudFrontServicePrincipal",
"Effect": "Allow",
"Principal": {
"Service": "cloudfront.amazonaws.com"
},
"Action": "s3:GetObject",
"Resource": "arn:aws:s3:::your-bucket-name/*",
"Condition": {
"StringEquals": {
"AWS:SourceArn": "arn:aws:cloudfront::123456789012:distribution/EDFDVBD6EXAMPLE"
}
}
}
]
}
SPA 應用程式設定
對於 React、Vue、Angular 等 SPA，需要額外設定錯誤頁面處理：
Custom Error Response：
- HTTP Error Code：403
- Response Page Path：/index.html
- HTTP Response Code：200
這樣當使用者直接存取 /about 這類路徑時，CloudFront 會回傳 index.html，讓前端路由處理。
整合 EC2 / ALB
對於動態內容，CloudFront 通常與 ALB（Application Load Balancer）整合。
ALB 作為 Origin
1. 設定 Origin Domain
- 輸入 ALB 的 DNS 名稱（如 my-alb-123456.us-east-1.elb.amazonaws.com）
2. Protocol
- 建議使用 HTTPS Only
- 確保 ALB 有設定 SSL 憑證
3. Origin Shield
- 可選擇開啟，減少對 Origin 的請求
- 建議選擇與 ALB 相同或最近的區域
動態內容快取策略
對於 API 或動態內容，需要特別設定快取行為：
不快取的路徑（如 /api/*）：
- Cache Policy：CachingDisabled
- Origin Request Policy：AllViewerExceptHostHeader
部分快取的路徑（如 /products/*）：
- Cache Policy：自訂，設定較短的 TTL
- 可根據 Query String 或 Cookie 區分快取
健康檢查設定
CloudFront 會自動監控 Origin 健康狀態，但你可以調整：
Origin Connection Attempts： 預設 3 次
Origin Connection Timeout： 預設 10 秒
Origin Read Timeout： 預設 30 秒
Origin Keepalive Timeout： 預設 5 秒
架構設計需要第二意見？預約架構諮詢，我們的 AWS 認證架構師將提供專業建議。
SSL 憑證設定
使用 ACM 免費憑證
AWS Certificate Manager（ACM）提供免費的 SSL 憑證：
重要： CloudFront 只能使用在 us-east-1（N. Virginia） 區域的 ACM 憑證。
申請步驟：
- 切換到 us-east-1 區域
- 進入 ACM Console → Request Certificate
- 選擇 Public Certificate
- 輸入網域名稱（如 example.com, *.example.com）
- 選擇驗證方式（建議 DNS Validation）
- 在 DNS 新增驗證記錄
- 等待憑證狀態變為 Issued
自訂網域設定
1. 在 Distribution 新增 Alternate Domain Names (CNAMEs)
- 輸入你的網域（如 www.example.com）
- 可以輸入多個網域
2. 選擇 SSL Certificate
- Custom SSL Certificate
- 選擇剛申請的 ACM 憑證
3. 在 DNS 新增 CNAME 記錄
- 名稱：www
- 值：d1234567890.cloudfront.net（你的 CloudFront 網域）
HTTPS 強制導向
設定 Viewer Protocol Policy：
- Redirect HTTP to HTTPS（建議）
這樣所有 HTTP 請求都會自動 301 導向到 HTTPS。
描述：CloudFront SSL 設定介面截圖，標示 Alternate Domain Names、SSL Certificate 選擇和 Viewer Protocol Policy 設定位置 構圖：後台截圖、紅框標註重點設定區域 -->
快取優化策略
Cache Policy 設定
AWS 提供預設的 Cache Policy，也可以自訂：
預設 Policy：
| Policy 名稱 | TTL | 適用場景 |
|---|---|---|
| CachingOptimized | 預設 24 小時，最大 1 年 | 靜態資源 |
| CachingDisabled | 不快取 | API、動態內容 |
| CachingOptimizedForUncompressedObjects | 同上，但不壓縮 | 已壓縮的內容 |
自訂 Policy 設定項目：
- Minimum TTL：最短快取時間
- Maximum TTL：最長快取時間
- Default TTL：Origin 未指定時的預設值
- Cache Key Settings：
- Headers：哪些 Header 要納入快取 Key
- Cookies：哪些 Cookie 要納入快取 Key
- Query Strings：哪些參數要納入快取 Key
TTL 設定原則
| 資源類型 | 建議 TTL | 說明 |
|---|---|---|
| HTML | 5 分鐘 - 1 小時 | 內容可能經常更新 |
| CSS/JS（有版本號） | 1 年 | 透過 Cache Busting 更新 |
| 圖片 | 1 個月 - 1 年 | 通常不常更新 |
| API 回應 | 0 或很短 | 根據業務需求決定 |
| 使用者特定內容 | 0 | 不應快取 |
快取失效（Invalidation）
當需要強制更新快取時：
1. Console 操作
- CloudFront → Distribution → Invalidations → Create Invalidation
- 輸入路徑（如
/images/*或/*）
2. CLI 操作
aws cloudfront create-invalidation \
--distribution-id E1234567890 \
--paths "/*"
3. 費用注意
- 每月前 1,000 條路徑免費
- 超過後每條路徑 $0.005
建議： 與其頻繁 Invalidation，不如善用 Cache Busting（在檔名加版本號）。
安全性設定
AWS Shield 整合
CloudFront 自動包含 AWS Shield Standard，提供：
- Layer 3/4 DDoS 防護
- 無額外費用
Shield Advanced（付費）提供：
- Layer 7 DDoS 防護
- 24/7 DDoS Response Team
- 費用保護（攻擊造成的額外費用補償）
- 費用：$3,000/月 起
WAF 整合
AWS WAF 可以與 CloudFront 整合，提供：
- SQL Injection 防護
- XSS 防護
- Rate Limiting
- IP 黑白名單
- 地理封鎖
設定方式：
- 在 WAF Console 建立 Web ACL
- 區域選擇 CloudFront（Global）
- 新增規則（可使用 AWS Managed Rules）
- 在 CloudFront Distribution 中關聯 Web ACL
想了解更多 CDN 與 DDoS 防護，可以參考我們的專文。
地理限制
CloudFront 可以根據使用者的地理位置允許或封鎖存取：
設定位置： Distribution → Security → Restrictions → Geo Restriction
選項：
- Allow list：只允許特定國家
- Block list：封鎖特定國家
簽署 URL / Cookie
對於需要存取控制的內容（如付費內容），可以使用簽署：
Signed URLs： 適合單一檔案 Signed Cookies： 適合多個檔案或串流
成本優化
Price Class 選擇
不同 Price Class 的費用差異顯著：
| Price Class | 覆蓋區域 | 費用差異 |
|---|---|---|
| All Edge Locations | 全球 | 最高 |
| 200（排除南美、澳洲部分） | 北美、歐洲、亞洲 | 中等 |
| 100 | 北美、歐洲 | 最低 |
建議： 如果主要使用者在亞洲，選擇 Price Class 200 可以在效能和成本間取得平衡。
壓縮設定
開啟自動壓縮可以減少傳輸量，降低費用：
設定位置： Cache Behavior → Compress Objects Automatically → Yes
支援的壓縮格式：
- Gzip
- Brotli（效率更高）
節省效果： 通常可減少 60-80% 的傳輸量
更多 CDN 優化技巧，請參考 CDN 設定優化教學。
監控與預算警示
CloudWatch Metrics：
- Requests：請求數
- BytesDownloaded：傳輸量
- 4xxErrorRate / 5xxErrorRate：錯誤率
設定 Budget Alert：
- AWS Budgets → Create Budget
- 設定每月預算金額
- 設定警示閾值（如 80%、100%）
- 設定通知方式（Email、SNS）
想了解更多 CDN 費用與省錢技巧，可以參考我們的費用指南。
常見問題排解
403 Forbidden 錯誤
可能原因：
- S3 Bucket Policy 未正確設定
- OAC/OAI 設定錯誤
- S3 Block Public Access 設定
- 檔案不存在
解決步驟：
- 確認 Bucket Policy 包含 CloudFront 的存取權限
- 確認 OAC 設定正確
- 確認檔案路徑正確
504 Gateway Timeout
可能原因：
- Origin 回應過慢
- Origin 健康檢查失敗
- Origin Timeout 設定過短
解決步驟：
- 檢查 Origin 是否正常運作
- 增加 Origin Read Timeout（最大 60 秒）
- 優化 Origin 效能
快取未更新
可能原因：
- 快取尚未過期
- 瀏覽器快取
- TTL 設定過長
解決步驟：
- 建立 Invalidation 清除快取
- 清除瀏覽器快取或使用無痕模式測試
- 調整 TTL 設定
- 使用 Cache Busting（在 URL 加版本參數）
效能調校
檢查項目：
- Cache Hit Ratio：目標 > 80%
- Origin Latency：檢查 Origin 回應時間
- Edge Location：確認使用者連到正確的節點
優化方向：
- 增加快取涵蓋範圍
- 使用 Origin Shield 減少 Origin 負載
- 考慮使用 Lambda@Edge 做邊緣運算
進階功能
Lambda@Edge
在邊緣節點執行自訂程式碼：
使用場景：
- A/B Testing
- 動態內容產生
- URL 重寫
- 認證驗證
- 標頭修改
觸發點：
- Viewer Request：使用者請求到達 Edge
- Viewer Response：回應傳送給使用者前
- Origin Request：請求發送到 Origin 前
- Origin Response：Origin 回應到達 Edge 後
CloudFront Functions
比 Lambda@Edge 更輕量快速的邊緣運算：
限制：
- 只能用於 Viewer Request/Response
- 最大執行時間 1ms
- 最大記憶體 2MB
適合場景：
- URL 重寫
- 標頭修改
- 簡單的請求驗證
Origin Shield
在 Origin 前面增加一層快取：
好處：
- 減少 Origin 負載
- 提升快取命中率
- 降低 Origin 成本
費用： 依據請求數計費
實際案例：電商網站架構
一個典型的電商網站 CloudFront 架構：
架構：
使用者 → CloudFront → ALB → EC2 Auto Scaling Group
↘ S3（靜態資源）
Cache Behavior 設定：
| 路徑 | Origin | Cache Policy |
|---|---|---|
| /api/* | ALB | CachingDisabled |
| /static/* | S3 | CachingOptimized（1 年） |
| /images/* | S3 | CachingOptimized（1 個月） |
| Default (*) | ALB | 自訂（5 分鐘） |
安全設定：
- WAF 啟用 AWS Managed Rules
- Rate Limiting 防止暴力攻擊
- 地理限制只允許服務區域
結論：打造高效能 AWS 架構
完成本文的設定後，你的 CloudFront 應該已經：
- Distribution 正確設定並部署完成
- S3 或 ALB Origin 連接正常
- SSL 憑證設定完成
- 快取策略優化
- 基礎安全防護開啟
下一步建議：
- 監控 CloudWatch Metrics，確認效能指標
- 設定 Budget Alert，控制成本
- 定期檢視存取日誌，優化快取策略
- 考慮是否需要 Lambda@Edge 做進階處理
好的架構能節省數倍的營運成本。預約架構諮詢，讓我們一起檢視你的雲端架構。CloudInsight 團隊擁有多位 AWS 認證解決方案架構師，已協助超過 100 家企業優化 AWS 架構。
常見問題 FAQ
CloudFront 和 S3 Transfer Acceleration 有什麼不同？
CloudFront 是完整的 CDN 服務，提供快取、安全防護等功能。S3 Transfer Acceleration 只是加速上傳到 S3 的功能。如果你需要加速網站內容傳遞，應該使用 CloudFront。
CloudFront 的免費額度有多少？
AWS Free Tier 包含每月 1TB 傳輸量和 10,000,000 次 HTTP/HTTPS 請求，期限為 12 個月。超過後按用量計費，亞太區約 $0.12/GB。
可以同時使用 CloudFront 和 Cloudflare 嗎？
技術上可以，但通常不建議。兩層 CDN 會增加複雜度和延遲。如果你已經在使用 AWS，CloudFront 是更好的選擇；如果主要使用其他雲端或需要免費方案，Cloudflare 更適合。
CloudFront 支援 HTTP/3 嗎？
是的，CloudFront 支援 HTTP/3（QUIC）。可以在 Distribution 設定中啟用，對於行動網路使用者可以提升效能。
如何將現有網站遷移到 CloudFront？
建議步驟：(1) 先建立 CloudFront Distribution 指向現有 Origin；(2) 使用 CloudFront 網域測試；(3) 確認正常後，再將 DNS 指向 CloudFront。整個過程可以做到零停機遷移。