Blogger のガジェット更新用 API と「クリボウ式 Blogger カレンダー」の話

ずっと以前（もう 5 年以上前 !?）に公開していたカレンダーガジェット

• クリボウの Blogger Tips: Blogger beta にもカレンダー

がいつの間にか動かなくなっていたので、修正。

試験的にこのブログのサイドバーにも追加してみたので、いろいろ触ってみるといいかと。

どの日付に投稿が存在するかのデータをフィード（JSON）で取ってきて、カレンダー上にリンク表示するというところまでは問題なかったのだけれど、投稿があるとされる日付リンクをクリックしてもその投稿を表示できなくなっていた。

このガジェットの投稿の表示の仕方は、画面遷移なしにブログの投稿エリアのデータだけを動的に差し替えるというもの。Blogger 自体の、ガジェットを編集したときなんかに、リフレッシュなしにその変更が反映される仕組みをそのまま利用している。


Blogger のガジェット更新用 API

たとえば、このブログのカレンダーで 2012-04-30 の日付クリックすると、呼び出すようになっているのが次の URL。

http://kuribo-programming.blogspot.com/?action=nextposts&widgetId=Blog1&widgetType=Blog&responseType=js&path=http%3a%2f%2fkuribo%2dprogramming%2eblogspot%2ecom%2fsearch%3fupdated%2dmin%3d2012%2d04%2d30T00%253A00%253A00%252B09%253A00%26updated%2dmax%3d2012%2d04%2d30T23%253A59%253A59%252B09%253A00%26max%2dresults%3d500

説明のために、青字部分を URL デコードすると、こう。

http://kuribo-programming.blogspot.com/search?updated-min=2012-04-30T00%3A00%3A00%2B09%3A00&updated-max=2012-04-30T23%3A59%3A59%2B09%3A00&max-results=500

アクセスしてみると分かるけれども、2012-04-30 の 00:00 から 23:59 に投稿されたデータを最大 500 件取ってきて表示するという、Blogger ブログの検索ページの URL をそのまま渡している。

あとは赤字部分のパラメータ指定で、取得した投稿データを Blog1 という ID のウィジェット（投稿ウィジェット）に表示するための JavaScript コードが得られる。

実際にアクセスすると、返ってくるコードはこんな感じ。赤字部分に実際の投稿データが入る。

try {
_WidgetManager._HandleControllerResult('Blog1', 'nextposts',{'renderedData': '...'});
} catch (e) {
  if (typeof log != 'undefined') {
    log('HandleControllerResult failed: ' + e);
  }
}

変更点

カレンダーガジェットに話を戻すと…。

ここまで説明してきた Blogger のガジェット（ウィジェット）更新用 API は、これまでと変わらず正確に動くのだけれど、問題はその呼び出し方。カレンダーでは、POST メソッドでパラメータを送っていたのだけれど、いつの間にか

405 Method Not Allowed

になっていたみたい。しょうがないので、日付クリック時には JSONP 的に script タグをドキュメント末尾に追加するようにして、その src に最初の URL を指定することにした。

「動かないし！」とカレンダーに見切りをつけた人も、もう一度ブログにつけてもらえると嬉しかったり…。ガジェット追加は、最初に掲示したリンク先から。


自分の備忘録として記事にしてみたけれども、Blogger ブログの一部分のコンテンツを動的に変えたいプログラマな人は、参考にしてもらえるといいかと。