「分享」對話方塊

「分享」對話方塊能讓用戶將個人動態發佈至自己的動態時報、朋友的動態時報、社團,或者 Messenger 上的私人訊息。由於不需要「Facebook 登入」或任何進階權限,因此這是在網路上進行分享最簡單的方式。

如果用戶使用的瀏覽器並未透過 Cookie 登入,網頁就不會顯示供您選擇內容分享對象的下拉式功能表。如果應用程式使用「動態」對話方塊而非「分享」對話方塊,或使用 iframe 網頁檢視,同樣不會出現訊息欄位。

若要在原生行動應用程式實作「分享」對話方塊,請參閱 iOSAndroid 的相關指南。

整合

您可在 Facebook JavaScript SDK 中使用「分享」對話方塊。透過以下的程式碼片段即可觸發「分享」對話方塊。您也可使用重新導向至某個網址。如需詳細資訊,請參閱進階主題

Facebook JavaScript SDK

使用 FB.ui 函式並附加 share 方法參數來觸發「分享」對話方塊以分享連結。

若要分享連結:

FB.ui({
  method: 'share',
  href: 'https://developers.facebook.com/docs/',
}, function(response){});
自己動手嘗試!

在此網址的網頁內加入開放社交關係圖中繼標籤,以自訂分享回 Facebook 的動態。

請注意,只有在使用您應用程式的用戶已經使用「Facebook 登入」驗證您的應用程式時才會顯示 response.error_message

參數

常用參數

JS SDK 將自動提供這些參數。

參數說明

app_id

您應用程式的唯一識別碼。必要項目。

redirect_uri

用戶點擊對話方塊上的按鈕後重新導向至的網址。使用網址重新導向時為必要項目。

display

決定對話方塊的轉譯方式。

  • 如果您使用網址重新導向對話方塊實作,則會在 Facebook.com 中以完整網頁顯示。此顯示類型稱為 page
  • 如果您使用其中一個 iOS SDK 或 Android SDK 來叫用對話方塊,則會自動指定此項目並針對裝置選擇適當的顯示類型。
  • 如果您使用 Facebook JavaScript SDK,此項目將針對登入您應用程式的用戶預設為強制回應 iframe 類型,在 Facebook.com 上的遊戲中使用時設為 async,其他情況則設為 popup 視窗。如有需要,您還可以在使用 Facebook JavaScript SDK 時強制使用 popup 類型。
  • 行動版網頁應用程式將一律預設為 touch 顯示類型。

share 參數

參數說明預設

href

附加至此貼文的連結。使用 share 方法時為必要項目。在此網址的網頁內包含開放社交關係圖中繼標籤,以自訂分享的動態。

目前的網址

hashtag

由開發人員指定的主題標籤,用以新增至分享內容。用戶仍然可以移除對話方塊中的主題標籤。主題標籤應納入主題符號,例如 #facebook

null

quote

若要與連結一同分享引文(文章的摘要式引文),引文可由用戶反白標示,或者由開發人員預先定義。

null

mobile_iframe

如果設定為 true,分享按鈕就會在您網站上方的 iframe 中開啟「分享」對話方塊(若要瞭解詳情,請參閱「行動版網頁分享」對話方塊。此選項只適用於行動版,不適用於桌面版。

false


回應資料

參數 說明

post_id

只有在用戶使用 Facebook 登入您的應用程式並已經授予 publish_actions 時,才可使用此參數。如果可供使用,此參數為已發佈之開放社交關係圖動態的編號。

error_message

只有在用戶使用「Facebook 登入」登入您的應用程式時,才可使用此參數。

進階主題

您還可以善用以下進階功能:

「行動版網頁分享」對話方塊

「行動版網頁分享」對話方塊也可以顯示在您內容上方的 iFrame 中。完成分享程序之後,此對話方塊將會關閉,用戶將回到原始內容,輕鬆繼續瀏覽內容。

程式碼範例

若要在 iframe 中啟用「行動版網頁分享」對話方塊,請將 mobile_iframe 屬性設為 true

FB.ui({
  method: 'share',
  mobile_iframe: true,
  href: 'https://developers.facebook.com/docs/',
}, function(response){});
自己動手嘗試!

網址重新導向

若要分享連結:

https://www.facebook.com/dialog/share?
  app_id=145634995501895
  &display=popup
  &href=https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2F
  &redirect_uri=https%3A%2F%2Fdevelopers.facebook.com%2Ftools%2Fexplorer

注意: 測試此程式碼時,請移除分行符號。否則,您會遇到錯誤。

開放社交關係圖動作

使用 FB.ui 函式並附加 share_open_graph 方法參數來觸發「分享」對話方塊以分享開放社交關係圖動態。

若要使用此對話方塊分享開放社交關係圖動態:

FB.ui({
  method: 'share_open_graph',
  action_type: 'og.likes',
  action_properties: JSON.stringify({
    object:'https://developers.facebook.com/docs/',
  })
}, function(response){});

請注意,網址重新導向的運作方式和標準連結分享相同。

share_open_graph 參數

使用與分享標準連結相同的參數,但新增下列參數:

參數 說明

action_type

指定所要發佈之開放社交關係圖動作類型的字串,亦即,og.likes 表示內建讚類型。對話方塊還支援已批准的自訂類型。使用 share_open_graph 方法時為必要項目。

action_properties

鍵/值組的 JSON 物件,指定對應至所使用之 action_type 的參數。有效鍵/值組是相同的參數,可以在使用 API 發佈開放社交關係圖動作時使用。使用 share_open_graph 方法時為必要項目。

share_open_graph 對話方塊不支援 mobile_iframe: true