Really Simple HistoryでAJAXにブックマーク機能と履歴機能を付加する

文:Tony Patton(Special to TecRepublic)
翻訳校正:石橋啓一郎
2008/03/04 13:53

Really Simple History(RSH)は、AJAXでアプリケーションの状態を保持し、ブラウザによるナビゲーションを可能にするものだ。この記事では、RSHの概要と使い方について簡単に説明する。

 AJAXベースのアプリケーションに取り組んでいれば、その動的な性格から、アプリケーションのどこかでページをブックマークすることができないことに気づいただろう。これは、ユーザーが「戻る」ボタンを押した時にも問題になる。ブックマークと履歴の問題を解決する方法の1つが、Really Simple History(RSH)フレームワークを使うことだ。

 RSHの必要性は、動的なウェブサイトとブラウザ組み込みの操作方法の組み合わせに固有の問題から生じている。ブラウザは複数のページから成るサイトを念頭に開発されており、AJAXを用いた動的アプリケーションは前提としていない。

 問題は、ユーザーがAJAXを用いたサイトの外側でナビゲーションの操作をした場合に生じる。ユーザーがサイトに戻ってきた時には、ユーザーはその結果は起こることに驚くことになる。前にサイトを訪れた時の状態が維持されないからだ。

 この問題を解決するためには、ページが更新されたり、ブラウザのナビゲーションボタンでページを移動して回った場合でも、アプリケーションが状態を維持できる方法が必要となる。これによって、ユーザーはサイトに戻ってきたりブックマークしたりすることができるようになる。

 RSHは元々Brad Neuberg氏が2005年に開発したもので、今ではGoogle Codeのサイトで管理されている。最新バージョン(0.6)は2007年12月3日にリリースされたもので、Internet Explorer 7、Safari、Operaをサポートしている。

内部の仕組み

 RSHのすばらしい機能の1つは、標準のJavaScriptだけで作られていると言うことだ。サードパーティのライブラリなどの他のものには依存していない。RSHはアプリケーションデータを内部のJavaScriptキャッシュに保存しておき、ブックマークや「戻る」ボタンを使って以前の状態のアプリケーションに戻ってこれるようにしている。

 RSHのフレームワークは、dhtmlHistoryとhistoryStorageという2つのJavaScriptクラスから成っている。dhtmlHistoryクラスは、AJAXアプリケーションの履歴に関する抽象化を行う。ページは現在のURLとアンカーハッシュを使ってブラウザの履歴に追加される。さらに、AJAXアプリケーションは履歴リスナとして自分自身を登録する。ユーザーが「戻る」や「進む」のボタンで移動を行うと、履歴イベントがトリガされ、ブラウザの新しいURLとこれまでの履歴データが渡される。

 historyStorageクラスは、履歴データを保存することを可能にするものだ。historyStorageクラスは、ユーザーがサイトから移動してしまった時にサイトのデータが失われる問題を解決する。historyStorageクラスはハッシュテーブル(ブラウザ履歴を保存する際にハッシュが使われる)を処理するメソッドを持っている。このクラスを使うと、ユーザーがページを移動する際にデータを保存することができる。

 ハッシュはRSHの重要な側面だ。ハッシュはURLの最後に#記号に続けて記される。これは、RSHによる履歴を閲覧する機能を提供するのに使われる。

記事の感想やご意見をコメントでお寄せください(CNET_IDログインが必要です)
ログイン パスワードを忘れた方  |  新規登録
  • 新着記事
  • 人気記事
  • 特集
  • ブログ
  • 読者投票
    いよいよ7月11日に売り出される「iPhone 3G」。今のところの購入予定は?

    投票受付期間:2008年7月7日 〜 2008年7月11日
  • » 投票しないで結果だけ見る