JavaScript SDK - 範例

請閱讀我們的快速入門指南，了解載入和初始化 Facebook JavaScript SDK 的方法，並閱讀我們的進階設定指南，自訂自己的執行方案。然後，請嘗試透過我們的兩個範例來了解怎樣使用這個 SDK：

• 觸發「分享」對話框
• Facebook 登入

觸發「分享」對話框

使用「分享」對話框，讓用戶可以透過專頁在生活時報發佈連結，或者建立開放式圖表動態。系統會根據載入環境（流動版網頁或桌面版網頁）自動設定使用 JavaScript SDK 所展示的對話框格式。

現在我們來看看怎樣使用此 SDK 的 FB.ui() 方法觸發最基本的「分享」對話框。在基本設定程式碼中的 FB.init() 呼叫之後新增以下程式碼片段：

FB.ui({
  method: 'share',
  href: 'https://developers.facebook.com/docs/'
}, function(response){});
    

現在，當您重新載入專頁時，專頁頂端就會顯示一個「分享」對話框。無論對話框是因發佈動態還是因取消操作而關閉，關閉之後即會觸發回應函式。

請參閱 FB.ui 參考文件，查看可用參數的完整清單和回應物件的結構。

Facebook 登入

Facebook 登入讓用戶可以使用 Facebook 的身分來註冊或登入您的應用程式。

我們提供一份有關如何使用 JS SDK 執行 Facebook 登入的完整指南。不過現在，我們會先使用一些基本的範例程式碼，讓您了解其中的運作原理。在原始的 FB.init 呼叫之後插入以下程式碼：

FB.login(function(response) {
    if (response.authResponse) {
     console.log('Welcome!  Fetching your information.... ');
     FB.api('/me', function(response) {
       console.log('Good to see you, ' + response.name + '.');
     });
    } else {
     console.log('User cancelled login or did not fully authorize.');
    }
});
    

請參閱登入指南，了解這段程式碼的具體作用；但如果您尚未授予應用程式權限，則在重新載入頁面時會看到彈出的應用程式「登入」對話框。