読者です 読者をやめる 読者になる 読者になる

ゆーすけべー日記

はてなBlogってどーなの!?

「Webサービスのつくり方」Kindle版発売とアップデートすべき項目

Web Essay News

去年の11月20日に発売した拙作「Webサービスのつくり方」の Amazon Kindle版 が出ましたー! 出版社である技術評論社さんに頑張ってもらいました次第。

IMG_0763.JPG

お値段が紙の本よりほんの少々安いくらいなのですが、Kindle読める端末で持ち歩けるのでよろしければどうぞ〜

と推したいところで、書いたからには推すのですが、実は紙の書籍はもちろん、このKindle版にも「アップデートすべき項目」がいくつかあがって来ました。というのもTwitter APIを使った数カ所のコードサンプルが現状では動かなくなっているのです... 出版社さんとは相談しつつ改訂や公式のサポートページでフォローしていきますが、まずはこちらの記事でざっくりと項目と修正案を紹介したいと思います。



「ぐだぐだ言ってないでコードを書けよ、ハゲ」で出てくるスクリプト

短いコードをサクっと書くことで検証も出来るよ〜という例でTwitter Search APIを使っているのですが、そのAPIが「1.1」というバージョンへ完全移行してしまったために以下のように掲載されているコードが動きません。

screenshot_2013_07_14T23_29_23+0000.png

今書くならば「Net::Twitter::Lite」というモジュールを使ってこのようになります。

use Net::Twitter::Lite::WithAPIv1_1;
use Config::Pit;
use Encode;
use utf8;

binmode STDOUT, ':utf8';

my $config = pit_get('twitter-api');
my $nt = Net::Twitter::Lite::WithAPIv1_1->new(
    consumer_key => $config->{consumer_key},
    consumer_secret => $config->{consumer_secret},
    access_token => $config->{token},
    access_token_secret => $config->{token_secret}
);
my $result = $nt->search(
    {
        q => 'おはよう',
        lang => 'ja'
    }
);

for my $tweet ( @{ $result->{statuses} } ) {
    print "$tweet->{text}\n";
    print "----------------------------------------\n";
}

検証用のスクリプトなら既存の便利なCPANモジュールに頼っちゃった方がいいっすね。


「30分、JavaScriptでつくるWebサービスの動くモック」に出てくるJS

Instagramの写真検索サービスをJavaScriptだけでつくっちゃえ、しかも30分で。という節です。 これまた古いTwitter Search APIを使っているので認証かまさないと動きません。一旦Twitterから離れて似たように面白いサービスがつくれないか?を考えていますが、なかなか思いつかないので、TopsyというTwitterと連動する検索サービスのAPIを利用して同じ挙動を実装してみます。

TopsyのAPIを利用するには、APIキーが必要なので、以下のページから申請をします。

ちなみに無料での利用は7,000リクエストまでとなっておりそれ以上はTopsy側とご相談みたいです。モックアップをつくるレベルでは無料のお試しである程度十分だと思います。

screenshot_2013_07_15T00_05_49+0000.png

このあたりのコードを以下のように修正するとTopsy APIでInstagram検索が叶えられます。

$(document).ready(function(){
  var apikey = '';
  $('#form').submit(function(){
    var query = $(this).children('input[name="q"]').val();
    if(!query) return false;
    $.ajax({
    url: 'http://otter.topsy.com/search.js',
      data: {
        apikey: apikey,
        q: 'site:instagr.am ' + query,
        allow_lang: 'ja'
      },
      dataType: 'jsonp',
      success: function (json){
        var entries = json.response.list;
        if(!entries) return;
        $.each(entries, function(){
          console.log(this.content);
          console.log(this.medium_thumbnail);
        });
      }
    });
    return false;
  });
});


「Web APIで巨人の肩に立つ」の例

この節でもTwitter Search APIをおもっきし使ってますw ただ、所々の解説はWeb API全般に通じる汎用的なものとなっているので例題を返ればよいはず。 ってことでWeb API入門として触るのに「YouTube Data API」はどうかなーって思っています。 例えば、YouTubeにある動画の中から「歌ってみた」を検索し、人気順でURLを列挙するPerlスクリプトはこんな感じです。

use LWP::UserAgent;
use URI;
use JSON qw/decode_json/;
use Encode qw/encode_utf8/;
use utf8;

my $query = '歌ってみた';
my $uri = URI->new('http://gdata.youtube.com/feeds/api/videos');
$uri->query_form(
    alt => 'json',
    order_by => 'rating',
    q => $query
);
my $ua = LWP::UserAgent->new;
my $res = $ua->get($uri);
die "Error: " . $res->status_line if $res->is_error;
my $json = $res->decoded_content;
my $ref  = decode_json($json);

for my $entry ( @{ $ref->{feed}{entry} } ) {
    print $entry->{link}[0]{href} . "\n";
}


「いかにして大量のおっぱい画像をダウンロードするか」は?

動いてる ヤタ━━━━━━ヽ(゚`∀´゚)ノウヒョ ━━━━━━!!!



休日あけたら編集者さんと相談してこれらを分かりやすく読んでもらっている方へ分かりやすく伝えるようにします。ってことで変更箇所はまだ反映されてないけど、そのうちアップデートかかると思うので、Kindle版の「Webサービスのつくり方」もよろしくお願いします。