使用parse.com Cloud Code Hosting進行Facebook登入存取 - 3

繼上一篇成功截取出使用者資料後，發現除了基本資料外，朋友、按讚的資訊等資料其實都抓不出來，原因是因為沒有給予app存取這些資訊的權限。要求權限的話可以透過OAuth來索取access token，其範例網址如下：

https://www.facebook.com/dialog/oauth?client_id={appId}&redirect_uri={redirectURI}

這是一個截取基本權限的網址，appId指的是每一個app獨立的ID，而redirectURI是當OAuth通過後，會送發一串code到這個redirectURI去，而若需要要求其他權限，可以增加scope屬性如下：

https://www.facebook.com/dialog/oauth?client_id={appId}&redirect_uri={redirectURI}&scope={accessPermissions}

這個scope以逗號作為分隔，填在裡面的將會在facebook dialog中要求權限。

講了這麼多，但以第一篇中使用了parse-facebook-user-session該怎麼修改呢？稍微翻了它的source code後發現它在實作上並沒有保留scope欄位，因此我便把scope加上去了，可以由此瀏覽：parse-facebook-user-session
UPDATE：原Repository已經將此功能merge上去，直接使用原本的即可

使用方式的話則與先前的沒什麼差別，只是可以選擇多填一個scope欄位，範例如下：

app.use(parseFacebookUserSession({
  clientId: 'YOUR_FB_CLIENT_ID',
  appSecret: 'YOUR_FB_APP_SECRET',
  redirectUri: '/login',
  scope: 'user_friends,user_likes', // 要求friends與like資訊
}));

至於有哪些權限可以要求，可以當https://developers.facebook.com/tools/explorer/中，點選Get Access Token來參考，並且在下面做測試。

不過要注意的有像是user_friends這項，如果在API v2.0以上的版本上要求資訊的話，只會列出同樣有授權此app的好友出來，開了幾個test users測試的確如此：

很可憐沒有朋友授權此APP：

{
  "id": "104342733239984",
  "name": "Hello world",
  "friends": {
    "data": [],
    "summary": {
      "total_count": 1
    }
  }
}

可以看到summary中，total_count為1，但data中無資料。

有朋友也授權此APP：

{
  "id": "1421116644879628",
  "name": "Doraemon Cat",
  "friends": {
    "data": [
      {
        "name": "Open Graph Test User",
        "id": "1414470195545509"
      },
      {
        "name": "Monkey D Luffy",
        "id": "100347703641647"
      }
    ],
    "paging": {
      "next": "https://graph.facebook.com/1421116644879628/friends?limit=25&offset=25&__after_id=enc_AdAMpWdRxSLZAvND6bEd0htyyGsZAZBvzP6jzoAIZBKS9EiBSndZCNZC3S1AC5TEYchbuuBSV0xvg7ziwO4Cdt843yZApF"
    },
    "summary": {
      "total_count": 2
    }
  }
}

可以看到此test user有兩個朋友也都有安裝此app。

至於怎麼得到test user的access token，我是利用parse.com的API Console，Endpoint填入users且Use Master Key改成Yes，send request後即可在response中看到access token，即可複製此token到https://developers.facebook.com/tools/explorer/中做測試，如下圖。

使用parse.com Cloud Code Hosting進行Facebook登入存取 - 2

延續上一篇，成功使用facebook登入parse.com的使用者資訊後，接著就是怎麼從使用者資訊中取得facebook的資料了。

以上圖的Facebook Test Users為例，建立完的使用者可以由parse.com的Data中看到，不過authData卻只顯示了Facebook的ID，因此我們可以先透過API Console來對users作存取，這裡要注意的是Use Master Key記得要選Yes，否則會沒有權限看authData的內容；users後面的參數為objectId，若不放置則會列出全部符合的資料。

 在Response中的內容：

{
  "authData": {
    "facebook": {
      // 不要想對這組access_token亂來，因為是test user XD
      "access_token": "CAAMCk3Pv7SkBAEjfvRaG4SrC8k3CXak1843iisuUJiIK9gYV9PNFRraXi9gxYVBJO83zsvzFO91dcACevKwinxAVPNCUeEv0UPWsmv7DZBlqPjtZCCnEBcMBKpU7ikoj9OKo1ZCwzi3wmTycsB2avHT1SiBxLUF5ZAHTaT9XDNtz1phGZCk0lltOY5agj0JGQ9ezNGmOsvUmdpKFASx5K",
      "expiration_date": "2015-08-15T17:52:46.495Z",
      "id": "118563748477765"
    }
  },
  "createdAt": "2015-06-16T17:52:48.623Z",
  "name": "Super Mario",
  "objectId": "wmVm7Qb1Fc",
  "sessionToken": "jEKKzfbDcIN0CmBIvsdZR9Aoc",
  "updatedAt": "2015-06-17T07:57:08.934Z",
  "username": "3GwDpgmuqmfnyGYINNI27W9fO"
}

已經知道存放在哪裡之後，接下來就是利用cloud code function建立資料存取了！在這裡我用名字與圖片作範例，參考了stackoverflow這篇的回答稍微修改了一下：
當然，別忘記userMasterKey...

Parse.Cloud.define("facebook", function(request, response) {
  Parse.Cloud.useMasterKey();
 
  new Parse.Query(Parse.User).get(request.params.user_id).then(function(user) {
    var authData = user.get("authData");
 
    // Quit early for users who aren't linked with Facebook
    if (authData === undefined || authData.facebook === undefined) {
      response.success(null);
       return;
    }
 
    return Parse.Cloud.httpRequest({
      method: "GET",
      url: "https://graph.facebook.com/me",
      params: {
        access_token: authData.facebook.access_token,
        fields: "name, friends",
      },
    });
 
  }).then(function(json) {
    response.success(json.data);
 
  // Promises will let you bubble up any error, similar to a catch statement
  }, function(error) {
    response.error(error);
  });
});

在Express中call建立好的cloud host function：

app.get('/test', fbLogin, function(req, res) {
  var user = Parse.User.current();
  Parse.Cloud.run('facebook', { user_id: user.id }, {
    success: function(results) {
      res.send('Congrats, you are logged in, ' + results.name + '!' +  '');
    },
    error: function(error) {
      console.log("error :" + error);
    }
  });
});

若是成功的話就能在自己的URL中看到如下圖的結果了！

UPDATE：使用parse.com Cloud Code Hosting進行Facebook登入存取 - 3