Facebookのカウント取得を改善

ソーシャルボタンを自作に変更の所でソーシャルボタンをJavaScriptを使って取ってくる様なのを自分で書くようにしてるのですが、Facebookのカウント数取得がこのままだと上手くいかないこともあるようなので改善。

これまでのFacebookのカウント数取得数
改善したもの

これまでのFacebookのカウント数取得数

追記: 2016/08/22

FacebookのAPIが変更されシェア数の取り方が変わった

API仕様が変更されたので現在は取り方がちょっと下の物と違っています。上のポスト参照。 (sharesshare.share_count)

追記ここまで

ソーシャルボタンを自作に変更の所でやったように、数は

http://graph.facebook.com/?id=<URL>

というURLを叩くと

{
  "id": "<URL>",
  "shares": 37
}

みたいな物が帰ってくるのでこのsharesの数を取ってくれば良い、とうことでした。

e.g.)

http://graph.facebook.com/?id=http://rcmdnk.github.io/blog/2014/02/19/computer-markdown/

具体的には

url = '<URL>';
socialData = {
  type: 'GET',
  dataType: 'jsonp',
  url: '//graph.facebook.com/';
  data: {
    noncache: new Date().getTime()
    id = url;
    },
  success = function(data){
    $('.facebookCount[data-share-url="'+url+'"]').text(data.shares||0);
    $('.facebookCount[data-share-url="'+url+'"]').data("count",data.shares||0);
  },
  error: function(data){
    console.log('Error to get facebook count');
  },
}
$.ajax(socialData);

jQueryのAjaxを使ってこんな感じです。

ページにfacebookCountというクラスを持った要素を作っておいてその中の値を書き換えています。

改善したもの

JavaScript - Google+1のシェア数をクライアントサイドだけで取得 & Facebookのシェア数の取得に関する特殊な事情 & ちょっと宣伝 - Qiita

というのを見つけて、どうやらsharesという物が必ず帰ってくるわけではなく、 likesという値を持ったJSONを返してくることもあるとのこと。

ただし、このlikesはsharesと同じ数ではなく、さらに別の方法で取ってきたtotal_countと合わせた数が上のsharesと同じ最終的なトータルの数になる、ということでした。

このtotal_countはFacebook Query Language (FQL)を使って取ってこれて、

https://graph.facebook.com/fql?q=SELECT total_count FROM link_stat WHERE url='<URL>'

みたいな形のURLを叩くと取ってこれます。

このままだとアドレスバーに入れてもダメですが、エンコードして

http://graph.facebook.com/fql?q=SELECT%20total_count%20FROM%20link_stat%20WHERE%20url='<URL>'

こんな感じにすれば好きなURLのtotal_countがブラウザでも見れます。

e.g.)

http://graph.facebook.com/fql?q=SELECT%20total_count%20FROM%20link_stat%20WHERE%20url=%27http://rcmdnk.github.io/blog/2014/02/19/computer-markdown/%27

これが返すJSONは

{
  "data": [
    {
      "total_count": 37
    }
  ]
}

な感じです。(dataの値が一度配列になってその中にハッシュがあるのでちょっと注意。)

ということで、上のコードをこんな感じで直してみます。

url = '<URL>';
socialData = {
  type: 'GET',
  dataType: 'jsonp',
  url: '//graph.facebook.com/';
  data: {
    noncache: new Date().getTime()
    id = url;
    },
  success = function(data){
    if('likes' in data){
      var n = data.likes;
      var fdata = {
        type: 'GET',
        dataType: 'jsonp',
        url: '//graph.facebook.com/fql',
        data: {
          noncache: new Date().getTime(),
          q: "SELECT total_count FROM link_stat WHERE url='" + url + "'"
        },
        success: function(data) {
          n += data.data[0].total_count;
          $('.facebookCount[data-share-url="'+url+'"]').text(n);
          $('.facebookCount[data-share-url="'+url+'"]').data("count",n);
        },
        error: function(data){
          console.log('Error to get facebook count by fql');
        }
      };
      $.ajax(fdata);
    }else{
      $('.facebookCount[data-share-url="'+url+'"]').text(data.shares||0);
      $('.facebookCount[data-share-url="'+url+'"]').data("count",data.shares||0);
    }
  },
  error: function(data){
    console.log('Error to get facebook count');
  },
}
$.ajax(socialData);