lifeLOG + REPOsitory: Blogger で作ったブログの記事の内容を表示する #1

記事の一覧を表示するところまではできた。次は、各記事の内容を表示する機能を作り込む。

ユーザ体験

ユーザ体験はシンプル。単に記事一覧の項目をクリック(iOS デバイスなら、タップ)すると、(Blogger のブログに飛ぶ代わりに)記事の内容を表示する。

この機能(記事表示機能)が完成した後、Blogger Glass には (a) 記事一覧表示画面、(b) 記事内容表示画面の 2 つの画面ができることになる。

全体構想

画面デザイン(意匠)

記事表示画面に限らず、Blogger Glass の画面はこの(→)ようにする。やがては、サイドバー等についても組み込むつもりだが、現時点ではごくシンプルなものにしておく。

現状の記事一覧画面はこのデザインと少し異なっているが、記事表示機能の実装が終わったら、リファクタリングする予定だ。

今回作る記事表示画面では、「Contents」エリアに記事のコンテンツを流し込むだけにする。装飾等はなし。CSS によるスタイルもフォントの指定(ファミリー、サイズ)程度にしておく。

リクエストハンドラ

一覧表示、内容表示の両方を 1 つのリクエスト形式にまとめることもできる(例: リクエストパラメータで切り替える)。しかし、それではリクエストを処理するハンドラに余計な複雑さを持ち込むことになる。一覧表示と内容表示ではリクエストの目的が異なるのだから、素直に別形式のリクエストにする。当然、リクエストごとにハンドラを作る。

一覧表示用ハンドラ

従来のリクエストハンドラ。定義するファイル名、クラス名、ともに変更はしない。

変更するのは、記事のタイトルにリンクを張る部分。従来は、Blogger 上のブログの permalink をそのままリンクに使っていたが、これを内容表示用ハンドラへのリクエスト形式のものに変える。

内容表示用ハンドラ

新しく作るハンドラ。記事の内容を取得する。リクエストのパラメータとして、記事を識別する「何か」を受け取る。

テンプレート

テンプレートもリクエストハンドラ同様、2 種類用意する。一覧表示用と内容表示用だ。

調査

この機能の肝となるのは、各記事のコンテンツをどうやって取得するかだ。今のところ、ストレージは使わない方針で作っているので、内容表示リクエストを一覧表示リクエストとは別のリクエストとして受け付けるためには、フィードの取得もリクエストごとに独立して行わなければならない。

一覧表示のときと異なり、必要なフィードは特定の記事のものだけだ。特定の記事だけを指定することはできるだろうか？

Blogger の配信する Atom 形式のフィードには entry にふくまれる link で rel 属性の値が self になっているものがある。この link の href が各記事ごとのフィードを取得するための URL になっているようだ。

つまり、記事一覧表示用のリクエストハンドラ内で、記事への URL を取得するために抽出している link 要素を rel="self" のものに変えれば、個別フィードを識別する情報を取り出せることになる。

ちなみに、個別フィードへの link は以下のような形式だ。実際には、blogID と postID がブログごと、記事ごとの ID に置き換わっている。内容表示リクエストのパラメータとして、この postID を使うことにする。

<link rel='self' type='application/atom+xml' 
      href='http://www.blogger.com/feeds/blogID/posts/default/postID'/>

内部デザイン(設計)

リクエスト

リクエストハンドラが増えたことにともない、リクエスト形式も以下のように変更する。

リクエスト形式
リクエスト	機能
/	`page=0` を指定した場合と同様。
/?page=<number>	`number` で指定したページの一覧を表示する。
/post/	最新の記事の内容を表示する。
/post/?id=<id>	`id` で指定した記事の内容を表示する。

フィード解析の変更

内容表示用のリクエストハンドラも、個別フィードを取得し Atom 形式のデータとして解析しなければならない。このため、パーサとフィードをくるんだオブジェクトに手を入れる必要がある。コードで言うと、これ(↓)。

lifeLOG + REPOsitory

2010-10-04

Blogger で作ったブログの記事の内容を表示する #1