FC2ブログ

blogaomu2.1はこの度、http://blogaomu.comに引っ越しました。最新の更新はblogaomu.comにて行なっておりますので、ブックマーク・RSS等の設定をお願い致します。

[JavaScript]twitpic APIで投稿写真のサムネイルを取得する

何気なくツイッターのタイムラインを見てたらtwitpic APIのversion 2 がうんたらかんたら、という話が出てきていたので、急にAPIを使って自分が投稿した画像を表示できないかなと思い試してみました。

twitpicはtwitterと連携した画像投稿サービスです。twitterのアカウントでログインし、twitpicに投稿すると画像入りのツイートとしてtwitterにも流れてきます。
http://twitpic.com

twitpicのAPIドキュメントです。
http://dev.twitpic.com/docs/

今回は自分の投稿した画像を取得したいので、users/showというAPIを使用します。特定のユーザー情報を取得したい時に使うAPIです。

ゆくゆくはブログパーツとかウィジェットのような感じにしたいなと思ったので、JavaScriptで実装しようと思います。


APIによって取得できるフォーマットはXML, json, jsonpの三種類。今回はjsonpを使います。
jsonpとか全然知らなかったのですが、取得するとfunctionで呼び出せる形になってて、JavaScriptでは扱いやすいデータ形式とのこと。私があまりにも初心者だったのでこちらの記事を参考にさせていただきました。
throw Life - 超シンプルなJSONP入門

こちらのエントリーのサンプルコードをほんのちょっと改造しただけの(おいっ!)シンプルな画像表示コードを書いてみました。
<script type="text/javascript">
<!--
function TwitpicLoad(json) {
var images = json["images"];
var html = "";
//最大10個のshort_idを取得する
for(var i = 0;(i < images.length && i < 10); i++) {
var elem = images[i];
var short_id = elem["short_id"];
var text = '<li><a href="http://twitpic.com/' + short_id + '"><img src="http://twitpic.com/show/thumb/' + short_id + '"></a></li>';

html += text;
}

document.getElementById("pics").innerHTML = html;
}
//-->
</script>

bodyタグ内
<div id="pics-wrapper">
<h2>photos</h2>
<ul id="pics" />
</div>
<script type="text/javascript" src="http://api.twitpic.com/2/users/show.jsonp?username=TAKAyuki_atkwsk"></script>

ページを開くとこんな感じで表示されます。(※画像です)
twitpicapi_20110247.png
1回のリクエストで取得できる画像のデータは20件となっています。20件全部を表示するのは多いなと思ったので最新10件だけ出すようにループの条件を変えています。

サムネイルは、以下のURLから取得できます。
http://twitpic.com/show/[size]/[short_id]
sizeにはthumb か mini
short_idはjsonの中に項目があるのでそれを入れます。

ユーザー情報を取得するだけであればauthenticationは必要ありません。
ユーザー名をパラメータとして渡してあげればOKです。

とりあえずシンプルに画像を取ってくることができたので、
あとは見た目をかえるなりしていけばウィジェットっぽくなりそうですね。
スポンサーサイト



シェアはこちらからどうぞ

このエントリーをはてなブックマークに追加

[サッカー]春の嵐の中、川崎-仙台を観てきた

2011年4月23日、Jリーグ再開!
友人モトヒロ氏と彼の仙台の仲間ほか多数と一緒に川崎-仙台@等々力競技場を観てきました。なお、今回はアウェー側仙台の応援席での観戦です。

続きを読む

シェアはこちらからどうぞ

このエントリーをはてなブックマークに追加

2011年の桜写真(他の花もあるよ)

こんにちは。久しぶりの風景画像のエントリーです。

東京では4月の頭くらいに桜が咲き始め、10日前後に満開、この記事を書いている17日にはソメイヨシノはほとんど散ってしまい、枝垂れ桜が丁度見頃な感じです。

ということで各所で撮影した桜の画像を載せていこうと思います。

続きを読む

シェアはこちらからどうぞ

このエントリーをはてなブックマークに追加

3.11 東京にいたのだけれど

青山にあるオフィス。午前中に一仕事終えて、午後はじっくりログの解析とプログラムの修正やるかー、と思い作業していたところ突然の揺れ。

「また地震か」

数日前くらいから体で感じる程度の地震が起こっていたので、またちょっと揺れるくらいだろうと思っていたのだけど・・・。周りの人もそんな感じで余裕ぶってた。
でもいつになってもおさまらない。周りの人もざわつき始めて「ちょっとヤバい」っていう感じを出し始めた。

棚に置いてあるたくさんのサーバー、本棚、パーテーション、机の上のディスプレイ・・・。
みんな揺れている。倒れてきそうだ。
とっさにサーバーを押さえに行こうとした人に「危ないから離れて!」と叫んだマネージャー。
この言葉で我を取り戻した。
ディスプレイを机の上に寝かせて、自分は何も倒れてこないであろう場所でただじっとしていた。机の下はマシンや配線類がたくさんあるので入れなかった。
(後で知ったけど机の下には入らないほうがいいという行動指針もあるようです。 :: 命の三角形: Voila la vie en rose!

どれくらい揺れていただろう。こんなに長く揺れたのは初めてだ。
揺れがおさまってtwitterのタイムラインを見た。みんな「揺れてる」って書いてる。こんなの見たことない。
それくらい範囲が広いのか。
とりあえず自分は無事だったので、「大丈夫です」と書きこんでおいた。
20110311_twitter.png

facebookにも書きこんでおいた。
スクリーンショット(2011-04-02 9.51.06)

自分の安全が確保されたので、家にいる同居人に連絡を取ってみる。とりあえずtwitterが手っ取り早かったので@で書き込みを何度か行う。
家の中は姿見が倒れただけで大丈夫。ほっとした。

しばらくたって防災無線が聞こえてきた。はっきりとは聞き取れなかったけど津波警報が出ているとのこと。
さすがにここまではこないだろう、そう思って特には気にしてなかった。
(今だから言えるけど気にしてないとだめだということが分かった。)

そこからはずっとtwitterを見てた。仕事どころじゃない。UstreamでNHKのTV放送が見れることが分かった。
出てきたのは津波で車が流され、街が水に浸かっている映像・・・。これはただごとじゃないと感じた瞬間。
東京は直接的な被害は少ないようだったけど、電車が動いていないという情報。これは下手に動くよりも一晩オフィスで泊まってから動いたほうが安全と判断した。この時点で16時半くらい。

ちなみに帰らなかった理由。
  • 徒歩で帰るとすると少なくとも2時間はかかる。
  • これから夜になるので気温が低くなり体力が奪われやすい。
  • 外が暗くなるので危険を回避しにくくなる。
  • 手持ちの食糧・水が確保できてない中で体力を使うのは怖い。
  • 歩いているときに大きな余震があった場合、情報が携帯電話からしか得られないので対処しにくい。
  • また、大勢の人が通りを歩いている状況なのでパニックになるのが怖い。
ということでずっとパソコンに張り付いて情報を得たりmixiに自分の状況を書いたりしてました。携帯メールは繋がりにくい状況。でもネットが使えたのでtwitter,facebook,mixi,skypeで情報を得てました。

21時くらいに近くの中華料理屋でご飯を食べる。なんか普通に料理が出てきて安心した。美味しかった。
そのあとオフィスに戻って、ふと思い出した。
「武蔵小杉のハッシュタグと検索ワードに引っかかったツイートを表示するwebサイトを作りかけてたなあ。」
中原区が停電していたという情報が入ってたこともあって、急遽作りかけのサイトを公開した。本当に役立つか分からないけど、twitterでサイトのURLを書き込んだ。お気に入りに登録したっていうツイートをもらったので、公開してよかったんだと思ってる。

2時くらいまでそんなことをしながら過ごして、オフィスの椅子を並べて眠りに着く。
でも余震が多くあまり眠れなかった。

結局4時過ぎに起きて、作りかけのサイトを携帯電話から見られるように調整した。まだまだ携帯電話使ってる人多いからな、と気づいたのは遅かったのかもしれない。外にいる人のほとんどにとってはモバイル端末のみがインターネットへの入り口なんだから。

携帯電話のバッテリーが切れそうだったので、今さらながら主要な連絡先を手帳に書き込む。これは普段からやっておくべきだと感じた。

夜が明けて準備が整ったところでオフィスを出た。爽やかに晴れた東京の朝。テレビ(正しくはUst越しに見たテレビ中継)で見た東北の姿とはまるで違う。すごく不思議な感じ。

家に帰ってからもTV中継を見ていたのだけど、見るに耐えなくなったのでラジオに移行。これで心が落ち着いた。地震の情報を流すだけではなく合間には音楽がかかり、力強いメッセージも紹介される。緊急時にはラジオが役に立つっていうのは本当なんだなと思った。

そんな感じで3.11を過ごしました。震災の被害があまりにも大きくて復興も長期戦になることが必至だと言われています。私はお金にそこまで余裕がないので、飲食店のチャリティーイベントに参加したり、ポイントを寄付したり、東北のお酒を飲んだりというような身近なことをやっていこうと思ってます。

そして、この3.11の経験を忘れないというのも今後に向けて大切なことなんじゃないのかなと思います。その時のことを思い出すのは辛いと思いますが、現地で町を建て直している人たちがいるんだということを再認識させてくれるのではないでしょうか。

あと、個人的すぎるけどまた東北を旅したいという思いがあって、美味しい地の物、美しい風景、癒しの温泉を体験したい(2年前は青森、去年は福島に行ってきた)。友人と今年は仙台に行こう、日本三景制覇の一つ目として松島に行こうって話をしていたのですよ。なので被災地から離れた私たちからも応援したい。

ということで備忘録を書かせてもらいました。

シェアはこちらからどうぞ

このエントリーをはてなブックマークに追加
プロフィール

TAKAyuki_atkwsk

お知らせ
最新記事
最新記事のRSSフィード

最新コメント
最新トラックバック
カテゴリ
タグクラウド
月別アーカイブ
ブクログ
携帯百景