はてなブックマークの数取得をhttpsでも出来るようにする

ソーシャルボタンを自作に変更で作った自作ボタンだとはてなブックマークの数がhttpsで接続するような場合だと取得出来なかったのでその部分を改良。

改良版はてなブックマークボタン

改良版はてなブックマークボタン

はてなブックマークのAPIはhttpsでの接続が出来ないので、

//api.b.st-hatena.com/entry.count&url=...

みたいにしておいてページと同じプロトコルを使おうと思っても httpsのページからだと上手く行きません。

そこで、ソーシャルボタンを自作に変更の中でもPocket等の数を取得するのに使った YQLというサービスを中継して取ってきます。

httpの場合は直接取ってきて、httpsの場合だけ経由して取るようにすると、下の様な感じ。 if('https:' == document.location.protocol){ のブロックの部分が追加された箇所です。

はてなブックマークのAPIは数だけを返すので data.query.results.resources.contentを直接見てあげればOK。

var socialCount = function (social, cname, url) {
  var vname = cname.replace(/-/g, "");
  if((new Function('return (typeof ' + vname + '!= "undefined");'))())return;
  (new Function('window.' + vname + ' = "defined";'))();
  url = (url)? encodeURI(url): encodeURI(location.href);
  socialData = {
    type: 'GET',
    dataType: 'jsonp',
    data: {noncache: new Date().getTime()},
    always: function(data) {
      timing.end = (new Date()).getTime();
      var t = timing.end - timing.start;
      ga('send', 'timing', 'social', social,  t);
    }
  };
  if(social == 'hatebu'){
    if('https:' == document.location.protocol){
      socialData.url = "//query.yahooapis.com/v1/public/yql";
      socialData.data.q = "SELECT content FROM data.headers WHERE url='http://api.b.st-hatena.com/entry.count?url=" + url + "'";
      socialData.data.format = "text";
      socialData.data.env = "http://datatables.org/alltables.env";
      socialData.success = function (data) {
        $('.' + cname).text(data.query.results.resources.content||0);
      };
    }else{
      socialData.url = 'http://api.b.st-hatena.com/entry.count';
      socialData.data.url = url;
      socialData.success = function(data){
        $('.' + cname).text(data||0);
      };
    }
  }else {
    return;
  }
  $.ajax(socialData);
  $('.' + cname).on('click', function() {
      ga('send', 'event', 'button', 'click', cname);
  });
}

このJavaScriptを読み込んでおいて

<div class="share-button">
  <ul>
    <li><a href="http://b.hatena.ne.jp/entry/http://rcmdnk.github.io/blog/2014/12/15/blog-octopress/"
    title="Save to Hatebu"
    target="_blank"><p class="hatebu_custom" >B! <span class="hatebuCountblog-2014-12-15-blog-octopress"></span></p></a></li>
  </ul>
</div>
<script type="text/javascript">
socialCount('hatebu', 'hatebuCountblog-2014-12-15-blog-octopress', 'http://rcmdnk.github.io/blog/2014/12/15/blog-octopress/');
</script>