如何使用Facebook登錄流星應用程序

我想創建一個只使用Facebook的自定義登錄，只能尋找兩個端點：「名稱」和「頭像」。如何使用Facebook登錄流星應用程序

對於初學者，我不知道「頭像」是否是一個真正的端點名稱，但這正是我想要訪問的。

我在FB上創建了一個測試應用程序，我還安裝了我需要的所有Meteor軟件包，以便完成基礎工作。

I've create the following template: 
<template name="Login"> 
    <h2>Login</h2> 
    {{#if currentUser}} 
     {{currentUser.services.facebook.name}} 
     {{currentUser.services.facebook.avatar}} 
     <button id="logout">Logout</button> 
    {{else}} 
     <button id="facebook-login" class="btn btn-default">Login with Facebook</button> 
    {{/if}} 
</template>

然後在SERVERS目錄中創建一個.js文件來存儲我的API密鑰。

我的問題：

我的第一個問題是在哪裏找到這些端點的名字，因爲我已經在去FB了整個文檔並沒有什麼參考「名」或「阿凡達」，所以我需要的第一件事瞭解是在哪裏找到這些端點，因爲我甚至無法找到「名稱」。

第二個問題是API顯示JSON對象，這通常是你如何連接你的端點，但在Meteor中，因爲所有這些都被抽象出來，所以目前還不清楚這個「facebook」對象存在於哪裏，然後深入研究嵌套屬性，名稱「和」頭像「（如果這是該屬性的正確名稱，我又不確定）。我假設因爲我使用流星調用像這樣的端點{{currentUser.services.facebook.name}}就夠了，我是否正確地考慮了這個問題？

最後一個問題是，如果我要調用這些端點像這樣我的模板裏面：

{{#if currentUser}} 
     {{currentUser.services.facebook.name}} 
     {{currentUser.services.facebook.gender}} 
     <button id="logout">Logout</button> 
    {{else}} 
     <button id="facebook-login" class="btn btn-default">Login with Facebook</button> 
    {{/if}}

那麼即使我在自己的div包住我的Facebook的名字和性別這樣的：

{{#if currentUser}} 
     <div class="name"> 
      {{currentUser.services.facebook.name}} 
     </div> 
     <div class="avatar"> 
      {{currentUser.services.facebook.avatar}} 
     </div> 
     <button id="logout">Logout</button> 
    {{else}} 
     <button id="facebook-login" class="btn btn-default">Login with Facebook</button> 
    {{/if}}

這仍然不會讓我很明顯如何移動它說頭？

換句話說，我將如何讓用戶從頁面主體登錄，但是他們登錄後在頭部有實際的用戶名和頭像？

我沒有明顯的方式來做到這一點。

我錯過了什麼？當我通過頁面正文登錄用戶時，DOM如何隨機移動.name和.avatar div到頁眉？

這是否有意義？

我的預感是我必須在標題內創建另一個模板來調用這些值？

任何人都可以玩這個，可以提供一些見解？

謝謝。

來源

2015-06-29 MARS

你問兩個不同的問題。您應該始終分開您的問題，以便人們可以爲您提供特定的幫助。在這種情況下，您正在詢問如何獲取Facebook個人資料圖片，然後您會問如何將其顯示在模板中。 – thatgibbyguy

@thatgibbyguy你是對的，這是一個很好的觀點。我通常會試着想，我花了我一分鐘才把這件事情弄糊塗了，但作爲一個經驗法則，我應該將問題分開。感謝下面的答案btw。 – MARS

你問題的第一部分是在這裏找到答案：

https://stackoverflow.com/a/15019052/1327678

回答你問題的第二部分是在文檔中。你可以做一個模板幫手檢查：

Template.header.helpers({ 
    currentUser: function(){ 
     if(Meteor.user()){ 
      return true; 
     } 
     else{ 
      return false; 
     } 
    } 
});

而且在模板中只是寫：

{{#if currentUser}} 
    {{!-- your facebook code here --}} 
{{/if}}

來源

2015-06-29 18:59:43 thatgibbyguy

如何使用Facebook登錄流星應用程序

回答

相關問題