sell效能
public

CDN 與快取

從離使用者最近的城市送出圖片、影片與網頁,而不是從遙遠的伺服器。

330+網路涵蓋城市
~50ms離 95% 網路使用者的距離
348 Tbps網路總頻寬
0需要自購的硬體
lightbulb

CDN 是什麼?

CDN(Content Delivery Network,內容傳遞網路)是一個遍布全球的伺服器網路,把你網站內容的複本放在離訪客很近的地方。這樣一來,每個請求就不必千里迢迢回到你唯一的來源伺服器(origin server),Cloudflare 直接從附近的城市送出快取(cache)複本,網頁因此載入更快,你的伺服器也輕鬆許多。

store

把它想成街角的便利商店

想像一座遠在天邊的大型倉庫(你的來源伺服器)。CDN 就像在每個街角都開一家便利商店(邊緣節點 edge node),架上擺著最熱賣的商品。你只要到街角店幾秒鐘就拿到東西,不必開車跑去倉庫。

這些附近的伺服器叫做邊緣節點(edge node)或邊緣據點。Cloudflare 在全球 330 多個城市經營這些節點,讓內容距離全世界 95% 連網人口大約只有 50 毫秒。

help

為什麼要用 Cloudflare 的 CDN?

沒有 CDN 時,每位訪客不管在哪,都得等內容在他和你唯一的伺服器之間來回跑。對遠方使用者來說很慢,流量暴增時也很危險。

rocket_launch

處處都更快

快取內容由離每位訪客最近的城市送出,大幅縮短來回距離。

savings

頻寬更省錢

每一次快取命中(HIT)都是來源伺服器看不到的請求,所以你付的來源頻寬與運算費用更少。

trending_up

扛得住流量暴衝

當你爆紅時,Cloudflare 用快取吸收暴增的流量,而不是讓你的伺服器被壓垮。

toggle_on

預設就開啟

只要網站經過代理(橘色雲朵),常見的靜態檔案就會自動被快取,完全不用改程式碼。

school

快取是怎麼運作的

當請求抵達邊緣節點,Cloudflare 會檢查自己手上有沒有還新鮮的複本,並透過一個叫 cf-cache-status 的回應標頭(response header)告訴你結果。

check_circle

HIT(命中)

邊緣節點手上有新鮮的快取複本,立刻送出,是最快也最省錢的結果。

cancel

MISS(未命中)

沒有快取到複本,所以 Cloudflare 去你的來源伺服器抓,並(若可快取)存起來給下次用。

history

EXPIRED(過期)

原本有複本,但時間到了,所以 Cloudflare 重新驗證或回來源抓一份新的。

block

BYPASS/DYNAMIC(略過/動態)

內容被刻意略過(BYPASS),或被視為動態(DYNAMIC)而預設不快取。

timer

邊緣 TTL vs 瀏覽器 TTL

邊緣 TTL(Edge TTL)是 Cloudflare 伺服器保留複本多久;瀏覽器 TTL(Browser TTL)是訪客瀏覽器自己保留複本多久才再次詢問。

layers

分層快取(Tiered Cache)

邊緣節點會先向附近的「上層」快取詢問,再決定要不要打擾你的來源伺服器,藉此提高快取命中率、減少回源流量。

rocket_launch

怎麼控制快取

你可以用兩種方式引導快取:來源伺服器送出的 Cache-Control 標頭,以及 Cloudflare 儀表板裡的快取規則(Cache Rules)。Cache-Control 是標準的 HTTP 標頭,用來告訴各層快取「誰可以儲存這個回應、可以存多久」。

httpCache-Control 標頭範例
# Cache a static asset publicly for 1 day (86400 seconds)
Cache-Control: public, max-age=86400

# Keep it 1 hour in browsers, but 1 day on Cloudflare's edge (s-maxage)
Cache-Control: public, max-age=3600, s-maxage=86400

# Never cache a private, per-user page
Cache-Control: private, no-store
  1. 讓網站經過代理

    在 DNS 裡確認你網站的紀錄顯示橘色雲朵。流量有經過 Cloudflare 代理時,快取才會運作。

  2. 建立一條快取規則

    進入 Caching > Cache Rules > Create rule。比對你想快取的檔案(例如 URI 路徑以 .jpg、.css、.js 結尾),設定「Eligible for cache(可快取)」並指定邊緣 TTL。

  3. 用回應標頭驗證

    把網頁載入兩次,檢查 cf-cache-status 標頭。第一次可能是 MISS,第二次應該就變成 HIT。

    bash
    curl -sI https://example.com/logo.png | grep -i cf-cache-status
    # cf-cache-status: HIT
  4. 更新時清除快取

    改了已快取的檔案後,到 Caching > Configuration > Purge Cache,強制 Cloudflare 抓取最新版本。

target

什麼情況快取最有幫助?

image

靜態資源

圖片、CSS、JavaScript、字型與下載檔很少變動,最適合大量快取。

newspaper

內容型網站

部落格、新聞、文件與行銷頁面被閱讀的次數遠多於被修改的次數。

groups

全球受眾

如果訪客來自許多國家,邊緣快取能消除每個人的長距離延遲。

campaign

上線與促銷活動

大型流量活動時,讓快取吸收負載而不是來源伺服器,會安全得多。

tips_and_updates

小提示與計費

lock_clock

快取靜態、略過私人內容

圖片、CSS、JS 盡量快取,但絕不要快取已登入或每位使用者專屬的頁面,這些請用 Cache-Control: private, no-store,避免某位使用者看到別人的資料。

  • 基本的 CDN 與快取在每個 Cloudflare 方案都免費。
  • 在檔名加上版本字串(例如 style.v2.css),更新時就能乾淨地讓舊快取失效。
  • 開啟分層快取(Tiered Cache)提高命中率,並保護較慢的來源伺服器。
  • Cache Reserve(付費附加功能)用持久儲存讓內容快取保留得更久。