GCP設定 Cloudflare 免費 CDN
本篇介紹 CDN 用途，以及如何在 Cloudflare 設定 CDN。
什麼是 CDN（Content Delivery Network）？
將網站中的靜態檔（如：圖片、影片、PDF）暫存在 Cloudflare，再將靜態檔流量統統導向 Cloudflare。此方式可達到減少主機負擔、降低流量成本的目的。由於步驟明確又能達到明顯效果，在著手更深入的網站效能優化前，開啟 CDN 功能通常會是優先執行的項目。而購物網站內容經常變動，例如：購物車數量、會員登入登出、商品即時庫存，資料都會隨時改變，因此先不考慮全站 CDN 的作法，只針對靜態檔的部份。
Cloudflare 優點
Cloudflare 的設定方式比 GCP 友善許多。雖然有時候 Cloudflare CDN 在尖鋒時段出圖速度有點慢，不過 Cloudflare 簡便的操作介面與其 DNS 零秒更新的優異能力，依舊是網站經營者最佳選擇方案之一。
準備 CDN 網址
後面的步驟會需要一個網址，網址可隨意命名，例如：cdn.yoursite.com 或 static.yoursite.com
將 CDN DNS 指向 VM IP
- 前往 Cloudflare，點選 DNS
- 點選 + Add record
- Name：子網域，
cdn.yoursite.com的子網域cdn - IPv4 address：VM 執行個體的外部 IP
xxx.xxx.xxx.xxx - Proxy status：Proxied，橘色的
- 點選 Save
重要：只有 cdn 子網域才要加橘色的 Proxied，商店網域必須是灰色的 DNS Only。
新增 CDN Page Rule
- 點選 Page Rules
- 點選 Create Page Rule
- 輸入你的 CDN 網址/*
cdn.yoursite.com/*後面加斜線 * - 選取 Cache Level
- 選取 Cache Everything
- 選取 Browser Cache TTL
- 選取 a month
- 選取 Edge Cache TTL
- 選取 a month
- 點選 Save and Deploy
設定 SSL/TLS 加密模式
- 點選 SSL/TLS
- 點選 Flexible
編輯並重啟 VM
接下來回到 GCP 修改網頁服務（Apache）設定檔。TekapoCart 已將這部份處理好了，只需依照下列步驟即可輕鬆完成。
貼心提醒：過程需約五到十分鐘，若不幸設定失敗，找問題也需要時間，因此請在網站流量較小時再進行以下步驟。
- 前往 GCP，點選左側選單：Compute Engine
- 點選次分類：VM 執行個體
- 點選 VM 執行個體
- 點選 編輯
- 點選 進階容器選項
- 點選 新增變數
- CDN 網址變數：
CDN_DOMAIN - CDN 網址：
cdn.yoursite.com
- 點選 儲存並重新啟動
- 待綠勾勾出現再等待五到十分鐘
啟用 Cart CDN
- 登入 gcp後台，後台選單：進階設定
- 點選次分類：效能
- CDN＃1：CDN 網址，
cdn.yoursite.com - 點選 儲存
- 點選 右上角 清除快取
開啟前台瀏覽網站，若商品圖都有出現，就代表成功！
完成
恭喜完成，有了 CDN，便能節省流量也同時減少流量費用喔。
問題排除
Q. 網站啟動後無法連線？
A. 請檢查 VM 執行個體的外部 IP xxx.xxx.xxx.xxx 是否與 Cloudflare DNS 中的 IP 相同。 GCP 試用帳號只能預約一組不會變的外部 IP，若你開了第二台 VM，第二台的 IP 在重啟後會改變，這時候就要將新 IP 更新至 Cloudflare DNS。
QQ咨询
旺旺咨询