Facebook 分享預覽是根據頁面 head 中的 Open Graph 中繼標記產生,而不是根據 Graph API 存取權杖產生。建立分享卡片的爬蟲會擷取公開 URL、解析其回傳的 HTML,並讀取四個必要屬性——og:title、og:type、og:image 和 og:url——每個屬性都以具有 property 屬性的 meta 元素表示。只要其中任何一個缺少或格式不正確,無論您設定應用程式或產生存取權杖多麼完整,預覽仍會降級。這就是為什麼「如何取得 Facebook Graph API 權杖」這個問題,對於分享預覽工作而言通常是問錯了。權杖用於透過 Graph API 對 Facebook 的資料層執行讀取與寫入作業——發布到粉絲專頁、擷取粉絲專頁洞察資料、上傳相片、列出留言——而這些作業都不參與連結預覽流程。連結預覽流程會讀取您自己伺服器上的 HTML。因此,如果您的目標是控制有人在 Facebook 貼文中貼上您的 URL 時所顯示的內容,實際做法是發布完整且有效的 Open Graph 區塊,而不是註冊應用程式並要求存取權杖。

how to get facebook graph api token
如何在沒有應用程式的情況下取得 Facebook Graph API 權杖

有人分享您的連結時,Facebook 會讀取什麼

當 Facebook 使用者將連結貼到貼文、留言或訊息中時,平台的爬蟲會擷取該頁面,並查看其 head 中的 meta 元素。它不會要求憑證,也不會代表您呼叫 Graph API 來呈現預覽。爬蟲的行為與其他網路爬蟲相同:要求公開 URL、解析 HTML,並從已有的中繼資料中選擇所需的值。

這就是 Open Graph Protocol 存在的原因。該通訊協定公開記錄於 ogp.me,定義一組小型、以屬性為基礎的中繼標記,用來將頁面描述為「圖譜物件」——一種可在不同服務間一致地分享、按讚及採取行動的事物,而這些服務都了解此規格。Facebook 的爬蟲、LinkedIn 的爬蟲、Slack 的連結展開器,以及其他幾個平台,全都採用同一組詞彙。WHATWG HTML 規格記錄了底層 meta 元素語意,包括瀏覽器與工具如何解析其屬性。

實際上,如果您的頁面 head 已經包含正確的 Open Graph 標記,Facebook 會在其爬蟲下次連到該 URL 時擷取這些標記。這整個過程不需要權杖、應用程式審查或 Graph API 呼叫。

為何 Graph API 權杖不會改變預覽

Facebook Graph API 存取權杖是一種憑證,用來證明要求來自已註冊的應用程式或已登入的使用者。當您想讀取圖譜(擷取粉絲專頁的貼文、發布到粉絲專頁、將相片上傳到個人檔案)或以程式設計方式發布內容時,就會使用權杖。這些都是 Facebook 資料層上的寫入作業。

連結預覽流程是您自己網站上的讀取作業。Facebook 的爬蟲會讀取您的 HTML。在中繼資料步驟中,它不會向 Graph API 進行驗證;它只會使用已經公開提供的 meta 標記。這就是為什麼開發人員為了「修正」分享預覽而追著權杖跑,最後往往只會得到一個可運作的應用程式、設定完成的產品,以及原本就有的空白或過時預覽。權杖從未接觸到預覽路徑。

相較之下,Open Graph 標記直接存在於爬蟲擷取的 HTML 中,而這才是您能夠影響的層級。

建立可立即用於分享的 Open Graph 區塊

這才是實際做法。您不必註冊應用程式、要求權限,以及用 OAuth 程式碼換取存取權杖,而是產生 Facebook 爬蟲實際上需要的中繼資料,並將其放到頁面上。

若不想手動編寫原始 HTML,最快的方法是使用 Open Graph 產生器。這是瀏覽器端工具,會根據 Facebook 需要的四項資訊,以及該通訊協定支援的三個選用屬性來建立區塊。所有作業都在您的瀏覽器中完成;不會將任何內容上傳到伺服器。

請依照下列步驟操作:

  1. 開啟 Open Graph 產生器,並以純文字輸入物件標題。請使用您希望使用者在 Facebook 分享卡片中看到的相同措辭。避免使用誘餌式標題,並讓值保持簡潔,以免在較小的卡片上遭到截斷。
  2. 從下拉式選單中選擇物件類型。此工具刻意將選項限制為 website 或 article。首頁、登陸頁面或產品頁面請選擇 website;網誌文章、新聞報導或編輯內容請選擇 article。
  3. 貼上標準頁面 URL。它必須是不含片段且未內嵌憑證的絕對 HTTP 或 HTTPS 連結。工具會將位址正規化,並拒絕其他格式,因為用戶端錨點會將相同資源的各種變體分散到不同分享中,而憑證則可能將帳戶資訊洩漏至公開中繼資料。
  4. 貼上可公開存取的圖片 URL。工具會檢查 URL 的格式,但不會擷取圖片,因此請自行確認該連結會回傳成功回應、提供圖片 MIME 類型,並符合每個平台針對最大預覽介面所建議的尺寸與位元組大小。
  5. 選擇性加入以一或兩句話摘要物件的 og:description、指定較大型出版品的 og:site_name,以及採用 language_TERRITORY 格式(例如 en_US)的 og:locale。產生器會修剪並限制每個值、拒絕控制字元,並逸出 &、引號與角括號,讓產生的 meta 元素不會失效。
  6. 產生區塊。輸出會是一小組以屬性為基礎、順序固定的中繼標記——先列出四個必要屬性,再依您填寫的順序列出選用屬性。複製整個區塊。

必要與選用屬性一覽

Open Graph 產生器公開的七個屬性可清楚劃分為必要集合與選用集合。下表會依類別、用途及範例值比較這些屬性,讓您一眼看出通訊協定強制要求的四個屬性,以及另外三個能增加內容深度但並非必要的屬性。缺少任何必要值時,產生器會封鎖輸出,而不會產生不完整的區塊。

屬性類別用途範例值
og:title必要按照物件在分享卡片中的顯示方式命名如何在沒有應用程式的情況下取得 Facebook Graph API 權杖
og:type必要為取用者分類物件article
og:image必要提供具代表性的預覽圖片https://example.com/preview.png
og:url必要識別永久的標準物件https://example.com/facebook-token/
og:description選用在標題下方摘要物件僅使用標記設定 Facebook 分享預覽的實用方法。
og:site_name選用為較大型出版物或品牌命名Example.com
og:locale選用指定資源的語言與地區en_US

將區塊加入標準頁面的 head

產生的標記要放在符合 og:url 值的頁面 head 中。只需貼上一次,而且只能貼在那裡。遵循幾項實用規則,即可避免區塊在不知不覺中被改寫或忽略。

請將區塊放在任何由框架插入的社交中繼資料之前。許多 CMS 外掛與 JavaScript 框架都會將自己的 meta 標記寫入 head。如果兩個區塊描述相同屬性,解析器會採用較後面的區塊,但較前面的區塊可能會讓偵錯工具混淆。該通訊協定指定的是 property 語法,而不是 name 語法,而取用者期望的正是這種格式。

請勿將區塊編碼兩次。將 meta 元素包在 JavaScript 字串內,然後在執行階段寫出,只會讓爬蟲無法運作。爬蟲擷取的是 HTML,而不是已執行的 DOM。

請勿將標記當成可見文字放在 body 中。它們不是面向使用者的內容,而是機器使用的中繼資料。

發布後,請檢視頁面原始碼,確認區塊確實存在且順序正確,並包含您輸入的值。建置工具可能會重新排序、覆寫或移除 head 內容。唯一重要的檢查,是爬蟲實際接收到的原始 HTML。

驗證爬蟲存取與快取重新整理

有效的 Open Graph 區塊是必要條件,但還不足以產生您真正想要的分享卡片。Facebook 的爬蟲可能會因 robots.txt 的禁止規則、驗證牆、受到速率限制的 CDN,或僅僅是先前的快取項目而遭封鎖。部署後,請進行以下兩項檢查以完成整個流程。

開啟平台目前的預覽偵錯工具,並輸入 og:url。偵錯工具會透過 Facebook 控制的爬蟲擷取頁面,並報告其看到的值、對缺少或無效屬性提出的警告,以及所下載圖片的大小。如果無法擷取頁面,分享預覽就會維持空白。

變更中繼資料後,請使用「再次擷取」動作強制重新整理快取。Facebook 會保留其上次所見中繼資料的內部副本;即時變更 URL 並不會立即使其失效。擷取呼叫會清除快取並重新擷取頁面。

請對您關注的其他平台進行相同檢查——LinkedIn 的 Post Inspector、Slack 的連結展開器、X 的 Card Validator——因為每項服務都有各自的圖片需求、快取規則與欄位後備值。

何時確實需要權杖

一旦您不再只是分享中的被動參與者,而是開始要求 Facebook 執行工作,便需要 Graph API 權杖。如果您想以程式設計方式發布到粉絲專頁、讀取洞察資料、將相片上傳到粉絲專頁相簿,或擷取留言清單,則每項要求都必須隨附由具備對應權限且審查狀態有效的應用程式所核發的存取權杖。這些受權杖控管的動作,都不會控制第三方分享時連結預覽的呈現方式。它們位於另一個層級。

因此,如果您取得權杖的唯一目的,是「讓 Facebook 在有人分享我的 URL 時顯示正確的預覽」,那麼 Open Graph 標記早已能滿足此需求。如果您確實需要讀取或寫入 Facebook 資料,請規劃註冊應用程式、設定 OAuth,以及管理權杖生命週期——但請預期這些工作是中繼資料層的補充,而不是取代中繼資料層。

如果您正在比較選項,無需伺服器呼叫的 Ads.txt 產生器 API 替代方案會詳細說明這一點。