每次把新文章貼到 Facebook 時,最讓人崩潰的莫過於:明明網站上的圖片已經換了,貼出來的預覽縮圖卻還是那張舊圖,甚至是一張完全不相關的圖。很多人以為是 Facebook 出問題,其實這背後是一套「快取(Cache)」機制在作祟。這篇文章就來談談 Facebook 預覽縮圖是怎麼產生的,以及該如何正確地更新它。

Facebook 預覽縮圖是怎麼來的?

當你把一個網址貼進 Facebook 的貼文框時,Facebook 的爬蟲(Crawler)會立刻去拜訪那個網頁,並從 HTML 的 <head> 區段中讀取一組稱為 Open Graph(OG) 的 meta 標籤。這些標籤決定了預覽卡片要顯示什麼:

  • og:title:預覽標題
  • og:description:預覽描述文字
  • og:image:預覽縮圖
  • og:url:這個網址的正式版本

如果網頁沒有設定 Open Graph 標籤,Facebook 就會自己「猜」——它會抓取頁面的 <title>、第一段文字,以及頁面上第一張夠大的圖片。這也是為什麼有時候縮圖會抓到側邊欄的廣告圖或 Logo,看起來莫名其妙。

為什麼縮圖不會即時更新?

關鍵在於 快取。Facebook 為了效能,不會每次有人分享連結就重新去抓一次網頁,而是把第一次抓到的結果存起來,之後重複使用。這個快取可能維持數天甚至數週。

所以當你做了以下任何一件事,縮圖就可能「來不及更新」:

  • 換掉了文章的主視覺圖片
  • 修改了 og:image 的網址
  • 修正了標題或描述文字
  • 網站剛從 HTTP 換成 HTTPS

Facebook 並不知道你改了東西,它只會繼續拿快取裡的舊資料來用。

第一步:確認網頁的 Open Graph 標籤

在怪 Facebook 之前,先確認自己的網頁有沒有正確設定 OG 標籤。以 Astro 這類靜態網站來說,通常會在 SEO 元件或版型中輸出。一個標準的設定長這樣:

<meta property="og:title" content="文章標題" />
<meta property="og:description" content="文章描述" />
<meta property="og:image" content="https://example.com/images/cover.jpg" />
<meta property="og:url" content="https://example.com/article/" />
<meta property="og:type" content="article" />

幾個常見的設定錯誤:

  • 圖片網址用相對路徑:og:image 必須是完整的絕對網址(含 https://),Facebook 的爬蟲無法解析相對路徑。
  • 圖片尺寸太小:Facebook 建議縮圖至少 1200 × 630 像素,比例約 1.91:1。太小的圖可能不會被採用。
  • 圖片無法公開存取:如果圖片需要登入才能看到,或 robots.txt 擋掉了爬蟲,Facebook 就抓不到。
  • 缺少 og:image:那就只能任由 Facebook 自己亂猜了。

第二步:用分享偵錯工具強制重新抓取

確認 OG 標籤沒問題後,接著要做的就是「叫 Facebook 重新抓一次」。Facebook 提供了官方的 分享偵錯工具(Sharing Debugger):

  1. 前往 Facebook 分享偵錯工具頁面(https://developers.facebook.com/tools/debug/og/object/)。
  2. 在輸入框中貼上你要更新的完整網址,按下「偵錯」。
  3. 工具會顯示 Facebook 目前快取的內容,包含它抓到的標題、描述與縮圖。
  4. 點擊 「再次抓取(Scrape Again)」 按鈕,強制 Facebook 重新拜訪你的網頁。
  5. 重新抓取後,縮圖就會更新成最新的版本。

這個「再次抓取」的動作可以重複點擊,每次都會強制刷新快取。如果第一次沒更新,等個幾秒再點一次通常就會成功。

第三步:如果還是沒更新怎麼辦?

有時候按了好幾次「再次抓取」,縮圖依然不動如山。這時可以依序檢查以下幾點:

  • 圖片本身有快取:如果你是把新圖覆蓋舊圖的同一個檔名,Facebook 或 CDN 可能仍拿到舊圖。解法是換一個新的檔名(例如加上版本號 cover-v2.jpg),並同步更新 og:image。
  • CDN 快取:若網站前面有 Cloudflare 等 CDN,記得也清一下 CDN 快取。
  • 網址不一致:https://example.com/article 和 https://example.com/article/(結尾有無斜線)在 Facebook 眼中是兩個不同網址,快取也是分開的。務必用對外正式的那個網址去偵錯。
  • 等待一段時間:Facebook 的快取有時就是需要時間,隔幾個小時再試也是辦法。

小結

Facebook 預覽縮圖不更新,九成以上的原因都是「快取」而非設定錯誤。處理流程其實很單純:

  1. 先確認網頁的 Open Graph 標籤正確(尤其是 og:image 要用絕對網址、尺寸足夠)。
  2. 用 Facebook 分享偵錯工具貼上網址,按「再次抓取」強制刷新。
  3. 若仍無效,改用新檔名的圖片、清 CDN 快取,並確認網址格式一致。

只要掌握這套流程,之後不管換了幾次主視覺,都能讓 Facebook 乖乖顯示你想要的縮圖。

✦ 獨立報導 · 讀者支持 ✦

以實際行動支持獨立觀點,與我們一同走得更遠

每一篇條理清晰的分析、每一次不隨波逐流的觀察,背後都是對真實與品質的堅持。我們拒絕內容農場與演算法流量綁架,堅持自由獨立的客觀發聲。

維持高品質的原創寫作與獨立營運,需要持續的實質力量。您可以選擇一次性贊助或每月定期支持,透過 Google 安全結帳,與我們一同守護這份深刻與清醒。

由 Google 安全處理付款 · 可隨時於 Google 帳戶管理或取消

為節省資源,留言將於捲動至此處或點擊按鈕後載入。