RSH（Really Simple History）
AJAXのUI問題に注目し、AJAXベースのアプリケーションでブラウザのデフォルト動作を維持するための取り組みを行っているフレームワークがいくつかあります。その1つがRSH（Really Simple History）フレームワークです。このフレームワークは、DhtmlHistoryとHistoryStorageという2つのオープンソースJavaScriptクラスから成っています。この2つのクラスを使用することにより、AJAXアプリケーションでブックマークと［戻る］／［進む］ボタンをサポートすることが可能になります。
DhtmlHistoryクラスはAJAXアプリケーションの履歴の抽象化を実現します。ブラウザに履歴イベントを追加するには、AJAXページでadd()メソッドを呼び出して新しい位置と関連履歴データを指定します。DhtmlHistoryクラスは、#new-locationなどのアンカーハッシュを使ってブラウザの現在のURLを更新し、この新しいURLに履歴データを関連付けます。AJAXアプリケーションは自分自身を履歴リスナとして登録します。ユーザーが［戻る］ボタンと［進む］ボタンで移動を行うと、ブラウザはadd()呼び出しで保存されたブラウザの新しい位置と履歴データを提供する履歴イベントを作動させます。
また、HistoryStorageクラスを使用すると、任意の量の履歴データを保存することができます。通常のWebページでは、ユーザーが新しいWebサイトに移動すると、ブラウザは元のWebページのアプリケーションとJavaScriptの状態をアンロードして消し去ります。ユーザーが後から［戻る］ボタンでそのページに戻った場合、そのデータはすっかり失われています。HistoryStorageクラスはこの問題を解決するために、put()、get()、hasKey()といった単純なハッシュテーブルメソッドを含むAPIを公開しています。開発者はこれらのメソッドを使用して、ユーザーがWebページから去った後も任意の量のデータを保存することができます。ユーザーが後から［戻る］ボタンで戻った場合、ページ内のコードはHistoryStorageクラスを通じて保存されたデータにアクセスできます。内部的な話になりますが、このデータストレージは隠されたフォームフィールドによって実現されており、ユーザーがページから去った後もブラウザがフォームフィールド値を自動的に保存するという点を利用しています。
Dojo
AJAXのナビゲーション問題のもう1つの解決策となるのがDojoです。DojoはWebアプリケーションが［戻る］ボタンと［進む］ボタンのクリックを捕捉し、ブラウザのロケーションフィールドにブックマーク用の一意のURLを設定できるようにします。
DojoはJavaScriptで書かれたオープンソースのDHTMLツールキットで、Webページ（またはJavaScriptをサポートする他の環境）に動的な機能を組み込むのに役立ちます。Dojoのコンポーネントを使用すると、Webサイトの使いやすさと応答性と機能性を高めることができます。Dojoでは、複雑なユーザーインターフェイスを容易に構築したり、対話的なウィジェットをすばやくプロトタイプ化したり、トランジションをアニメーション化したりできます。Dojoの低レベルのAPIと互換性レイヤは、移植可能なJavaScriptの記述やスクリプトの単純化に貢献します。さらに、そのイベントシステムや入出力API、汎用言語拡張は、強力なプログラミング環境の基盤となります。
dojo.undo.browserモジュールはブラウザの履歴へのアクセスを提供し、ユーザーがAJAXアプリケーションから出なくても［戻る］ボタンと［進む］ボタンをクリックできるようにします。このツールキットは［戻る］イベントと［進む］イベントが発生したときにコールバックメッセージを発行して、開発者にWebアプリケーションを適切に更新する機会を与えます。Dojoは隠されたIFRAMEを使ったり、ページURLのハッシュ部分に一意の値を追加したりすることで、ブラウザの履歴を生成します。
URLハッシュ形式に含まれるアプリケーション状態識別子を変更してもページの更新は行われないので、アプリケーションの状態を保持するにはURLハッシュを使用するのが理想的です。Dojoが生成する一意のハッシュ値はもともとブックマークをサポートしていますが、アプリケーション状態識別子としてもっと意味のある値を指定すれば、ブックマークの可読性を高めることができます。Dojoの状態オブジェクトはページの状態を表します。この状態オブジェクトは、ユーザーが［戻る］ボタンと［進む］ボタンをクリックしたときにコールバックを取得します。状態オブジェクトはdojo.undo.browserに直接登録するだけでなく、イベントをバインドするdojo.io.bind()に渡すこともできます。
Dojoの設定
dojo.undo.browserを使用するには次のようにします。
djConfig内でpreventBackButtonFixプロパティをfalseとして定義します。このプロパティにより、Dojoが隠されたIFRAMEをdocument.write()コマンドで現在のページに追加できるようになります。これを行わないと、dojo.undo.browserは正しく機能しません。- 適切なrequireステートメント（
dojo.require("dojo.undo.browser");）を追加します。 dojo.undo.browser.setInitialState(state);を呼び出すことにより、ページの初期状態を登録します。stateの部分には、ユーザーが［戻る］ボタンをクリックしたときに通知される状態オブジェクトを指定します。これでWebアプリケーションの開始まで戻ります（ユーザーが［戻る］ボタンをもう一度クリックすると、ブラウザはアプリケーションに先行するページ（もしあれば）に移動します）。
状態オブジェクトでは次の機能を定義する必要があります。
- ［戻る］通知の取得：
back()、backButton()、またはhandle(type)（typeには文字列"back"を指定） - ［進む］通知の取得：
forward()、forwardButton()、またはhandle(type)（typeには文字列"forward"を指定）
以下は非常に単純な状態オブジェクトの例です。
var state = { back: function() { alert("Back was clicked!"); }, forward: function() { alert("Forward was clicked!"); } };
ユーザーアクションの結果を表す状態オブジェクトを登録するには、次の呼び出しを使用します。
dojo.undo.browser.addToHistory(state);
あるいは、dojo.io.bind()を使用する場合で、かつ状態オブジェクトにback()関数、backButton()関数、またはchangeUrlプロパティが含まれているときは、dojo.io.bind()がdojo.undo.browserの呼び出しを処理します（これはXMLHTTPTransportとScriptSrcTransportのみを処理します）。
ブラウザのアドレスバー内のURLを変更するには、状態オブジェクトにchangeUrlプロパティを含めます。このプロパティをtrueに設定すると、dojo.undo.browserはフラグメント識別子に対して一意の値を生成します。それ以外の値（未定義、null、ゼロ、空の文字列を除く）に設定すると、その値がフラグメント識別子として使われます。つまり、開発者はDojoにハッシュ値を選択させるか、カスタムハッシュ値を設定することができます。どちらにしても、この機能によって、コードが現在のページ状態を再構築できるようなやり方で、ユーザーがページにブックマークを付けることが可能になります。
