查看: 1070|回復: 9

臉書社團自動登入的戶法外掛程式

[複製鏈接]
發表於 2018-10-29 17:37:26 | 顯示全部樓層 |閱讀模式
社團外掛程式可讓用戶從電子郵件訊息中或網頁上的連結加入您的 Facebook 社團。

https://developers.facebook.com/docs/plugins/group-plugin/#web
電子郵件專用社團外掛程式

電子郵件專用社團外掛程式可讓電子郵件的收件者,透過電子郵件訊息加入您的社團。您可以產生程式碼,然後將程式碼加入電子郵件服務供應商的訊息中,接著只要一鍵就能向收件者傳送訊息。
  • 僅可在電子郵件行銷活動軟體中使用這段程式碼。請勿在電子郵件用戶端的訊息中使用提供的程式碼。
  • 請勿在網頁中使用這段程式碼。


網頁專用社團外掛程式
網頁專用社團外掛程式是一種外掛程式,可用來在您的網頁中新增按鈕,讓每個人都能加入您的 Facebook 社團。此外掛程式使用 Facebook JavaScript SDK,在您的網頁上顯示按鈕。當用戶選取此按鈕時,將可加入您的社團。
  • 請勿在電子郵件訊息或電子郵件行銷活動軟體中,使用此外掛程式的程式碼。

逐步說明
請執行下列的步驟,以將外掛程式加到您的網頁。
1.進行 Facebook 應用程式的設定
  • 在您應用程式主控板的設定 > 基本中,選擇 + 新增平台。在選擇平台中,選擇網站。
  • 在網站的網址中,輸入您想讓外掛程式出現的網址。
  • 在應用程式網域中,輸入您網站的網域名稱。
  • 選擇位於視窗底部右側的儲存變更。

2.產生外掛程式的程式碼
下列的加入按鈕程式碼配置器會產生必要的程式碼,您可將這些程式碼加到您的網頁。在社團網址中,輸入您社團的網址,並調整設定,例如外掛程式按鈕的 width。選擇取得程式碼,產生您可以複製到網頁上的程式碼。





2.設定 Facebook JavaScript SDK

Facebook JavaScript SDK 沒有任何需要下載或安裝的獨立檔案,您只需要將一小段一般的 JavaScript 置入 HTML 中,就會以非同步的方式將 SDK 載入頁面中。非同步載入是指不會阻擋頁面中其他元素的載入。
以下程式碼片段會提供 Facebook JavaScript SDK 基本版,選項會設定為最常見的預設值。在每一個要使用 Facebook 分析工具的頁面上,將以下程式碼片段直
接插入開頭的 <body> 標籤後方。以應用程式編號取代 {your-app-id},並以鎖定的 API 版本取代 {api-version}。目前的版本為
v3.2。

  1. <script>
  2.   window.fbAsyncInit = function() {
  3.     FB.init({
  4.       appId      : '{your-app-id}',
  5.       cookie     : true,
  6.       xfbml      : true,
  7.       version    : '{api-version}'
  8.     });
  9.       
  10.     FB.AppEvents.logPageView();   
  11.       
  12.   };

  13.   (function(d, s, id){
  14.      var js, fjs = d.getElementsByTagName(s)[0];
  15.      if (d.getElementById(id)) {return;}
  16.      js = d.createElement(s); js.id = id;
  17.      js.src = "https://connect.facebook.net/en_US/sdk.js";
  18.      fjs.parentNode.insertBefore(js, fjs);
  19.    }(document, 'script', 'facebook-jssdk'));
  20. </script>
複製代碼
3.檢查登入狀態


載入您的網頁時,第一個步驟是確認用戶是否已經使用「Facebook 登入」來登入您的應用程式。呼叫 FB.getLoginStatus 來啟動這個程序。這個函式會觸發對 Facebook 的呼叫來取得登入狀態,接著呼叫您的回呼函式來傳回結果。

以下擷取自上述程式碼範例,為在頁面載入時用來檢查用戶登入狀態所執行的部分程式碼:

  1. FB.getLoginStatus(function(response) {
  2.     statusChangeCallback(response);
  3. });
複製代碼


提供給回呼的 response 物件含有數個欄位:


  1. {
  2.     status: 'connected',
  3.     authResponse: {
  4.         accessToken: '...',
  5.         expiresIn:'...',
  6.         signedRequest:'...',
  7.         userID:'...'
  8.     }
  9. }
複製代碼

status 說明此應用程式用戶的登入狀態。狀態可能為以下其中一項:
  • connected - 這位用戶已登入 Facebook,也已經登入您的應用程式。
  • not_authorized - 這位用戶已登入 Facebook,但尚未登入您的應用程式。
  • unknown - 這位用戶沒有登入 Facebook,因此您無法得知用戶是否已登入您的應用程式,或者之前已呼叫 FB.logout(),因此無法連結至 Facebook。

如果狀態是 connected,就會包含 authResponse,且由以下資料所構成:
  • accessToken - 含有這位應用程式用戶的存取權杖。
  • expiresIn - 以 UNIX 時間顯示權杖何時到期並需要再次更新。
  • signedRequest - 已簽署的參數,其中包含這位應用程式用戶的資訊。
  • userID - 這位應用程式用戶的編號。

您的應用程式知道這位應用程式用戶的登入狀態後,就會進行以下其中一項動作:
  • 如果用戶已登入 Facebook 和您的應用程式,就會將用戶重新導向至已登入的應用程式體驗。
  • 如果用戶沒有登入您的應用程式,或是沒有登入 Facebook,則使用 FB.login() 以「登入」對話方塊提示用戶,或向用戶顯示「登入」按鈕。


4.新增「Facebook 登入」按鈕
將「登入」按鈕加入您的頁面非常容易,參閱「登入」按鈕文件,並依照您要的方式設定按鈕。然後點擊取得程式碼,即會顯示所需程式碼,以便在您的頁面上顯示這個按鈕。
按鈕上的 onlogin 屬性是用於設定檢查登入狀態的 JavaScript 回呼,以瞭解用戶是否已經成功登入:

  1. <fb:login-button
  2.   scope="public_profile,email"
  3.   onlogin="checkLoginState();">
  4. </fb:login-button>
複製代碼


<fb:login-button
  scope="public_profile,email"
>
</fb:login-button>

  1. function checkLoginState() {
  2.   FB.getLoginStatus(function(response) {
  3.     statusChangeCallback(response);
  4.   });
  5. }
複製代碼
恭喜,您已經將「Facebook 登入」新增至您的網站!請務必查看其他說明文件頁面,以取得更多進階指南。
實作資料刪除回呼share-external
實作資料刪除回呼,以回應用戶從 Facebook 刪除其資料的要求。
「登入」對話方塊share-external
使用您自己的按鈕叫用「登入」對話方塊,而非使用「Facebook 登入」按鈕。
存取權杖share-external
使用「Facebook 登入」為您的網站產生的存取權杖。
權限share-external
管理您的應用程式可透過「Facebook 登入」存取的資料。
應用程式審查share-external
視您要求使用「Facebook 登入」的用戶所提供的 Facebook 資料而定,您可能需要在應用程式上線前,將應用程式提交審查。



回復

使用道具 舉報

 樓主| 發表於 2018-10-29 19:11:03 | 顯示全部樓層

FaceBook 登入 / 註冊 網站會員功能 – 詳細設定步驟教學


https://www.design-hu.com.tw/wor ... gin-registered.html
回復

使用道具 舉報

 樓主| 發表於 2018-10-29 19:15:14 | 顯示全部樓層
實作 FACEBOOK 臉書登入
https://ithelp.ithome.com.tw/articles/10196699
回復

使用道具 舉報

 樓主| 發表於 2018-10-29 19:19:57 | 顯示全部樓層
如何取得 Facebook 的應用程式密碼
https://www.alexclassroom.com/in ... book-app-passwords/
回復

使用道具 舉報

 樓主| 發表於 2018-10-29 19:20:35 | 顯示全部樓層

fb應用程式授權

fb應用程式設定

使用facebook帳號登入

fb應用程式重新授權

facebook應用程式


網站利用facebook帳號登入

fb授權不完整

app用fb登入

fb第三方登入

php fb登入
回復

使用道具 舉報

 樓主| 發表於 2018-10-29 19:22:21 | 顯示全部樓層

如何申請 Facebook 開發人員並建立 FB 應用程式 - 教您如何申...


如何申請 Facebook 開發人員並建立 FB 應用程式 - 教您如何申請臉書開發人員並建立 FB APP

Facebook APP | facebook APP 開發 | facebook APP 下載 | facebook APP 推薦 | 臉書 APP | 臉書 APP 分享 | 臉書 APP 開發 | 臉書 graphic APP | 臉書 關注 APP | 臉書 影片 APP | 臉書 生日 APP
http://polaris.streamer-forest.com/pr...

#Facebook #臉書 #APP開發
https://www.youtube.com/watch?v=8RHlb...

北極星購物商城 - 專門提供高品質的中文WordPress外掛以及多種資訊型產品!
http://polaris.streamer-forest.com/

北極星購物商城 Facebook 粉絲專頁
https://fb.me/sfmall

推薦電子書下載專區
http://polaris.streamer-forest.com/ca...
回復

使用道具 舉報

 樓主| 發表於 2018-10-29 19:34:40 | 顯示全部樓層
如何申請建立 Facebook APP ID 應用程式ID
https://sofree.cc/apply-facebook-app-id/
回復

使用道具 舉報

 樓主| 發表於 2018-10-29 19:37:36 | 顯示全部樓層
Facebook APP ID 申請,建立應用程式取得 APP 密鑰
https://www.techcoke.com/2014/05 ... api-key-app-id.html
回復

使用道具 舉報

 樓主| 發表於 2018-10-29 19:39:48 | 顯示全部樓層
如何取得facebook應用程式編號及密匙
https://open.mymy.tw/index-traitshow.html?id=145
回復

使用道具 舉報

 樓主| 發表於 2018-10-29 19:41:45 | 顯示全部樓層
如何建立 FB app 應用程式

回復

使用道具 舉報

您需要登錄後才可以回帖 登錄 | 立即註冊

本版積分規則

Archiver|手機版|小黑屋|leechenyang.com

JS of wanmeiff.com and vcpic.com Please keep this copyright information, respect of, thank you!JS of wanmeiff.com and vcpic.com Please keep this copyright information, respect of, thank you!

GMT+8, 2024-11-24 20:15 , Processed in 0.083227 second(s), 15 queries .

Powered by Discuz! X3.4

Copyright © 2001-2020, Tencent Cloud.

快速回復 返回頂部 返回列表