Lazy Programmer's Wlog / Tech

アカウント作成後、 http://bit.ly/a/account のページに記載されてる。

JSからアクセスできるAPIが用意されているので、それを利用するとサーバ側の処理を必要なく、簡単に変換することができる。また、変換しょりは、レンダリング後に遅延して実行されるようになっており、APIが詰まってしまい表示ができない等の問題が起こらないように設計されている。

Wlog記事タイトル右下の Tweet リンクを以下JSで作成しています。

<script type="text/javascript" charset="utf-8" src="http://bit.ly/javascript-api.js?version=latest&login=tomyhero&apiKey=R_52f38df86864628116ea58131cf48492"></script>
<script>
var G_box = new Array();
var G_title = new Array();
BitlyCB.shortenResponse = function(data) {
    var first_result;
    // Results are keyed by longUrl, so we need to grab the first one.
    var r;
    for (r in data.results) {
        first_result = data.results[r]; break;
    }
    G_box[r].innerHTML =  '<span style="padding-right:3px;"><a href="http://twitter.com/home/?status=' + encodeURIComponent(G_title[r]) + ' ' + encodeURIComponent(first_result.shortUrl) + '"><img width="15" src="http://parts.blog.livedoor.jp/img/cmn/twitter02.gif" border="0" />Tweet</a></span>' +  G_box[r].innerHTML ;
}   
    
 var boxes = $(".updated_at");
 var urls  = $(".article h2 a");

 for (i=0; i<boxes.length; i++) {
    G_title[urls[i]] = urls[i].innerHTML;
    G_box[urls[i]] = boxes[i] ;
    BitlyClient.shorten( urls[i], 'BitlyCB.shortenResponse');
 }
</script>

callback内で任意の、変数を取得できれば良いのだができなさそうだったのでグローバル変数を利用して表示場所を取得している。また、上記ソースで利用しているlogin,apiKey等は各自変更して下さい。

urlごとの問い合せ回数を、１回でまとめて問い合わせるようにする。

• http://bit.ly
• API Document
• JavascriptClientApiDocumentation