2009-02-20 8 views
19

よく知られているように、XHR(別名AJAX)ウェブアプリケーションでは、あなたのアプリの履歴はビルドされていません。また、リフレッシュボタンをクリックすると、ユーザは現在の活動から外れることがよくあります。私はlocation.hash(例えばhttp://anywhere/index.html#somehashvalue)を見つけて、リフレッシュの問題を回避しました(現在の状態をアプリに知らせるためにlocation.hashを使用し、ページロードハンドラを使用してその状態をリセットします)。本当に素敵でシンプルです。location.hashをXHRアプリケーションの履歴の解決策として監視していますか?

これは、私のアプリの履歴を追跡するためにlocation.hashを使用することについて考えさせてくれました。私は、彼らはアイフレームなどを使用しているため、だからここに私のニッケルとダイムだ、既存のライブラリを使用したくない:アプリケーションページのロードが、私はこれを起動したとき:

setInterval(
     function(){ 
      if (location.hash !== appCache.currentHash) { 
       appCache.currentHash = location.hash; 
       appCache.history.push(location.hash); 
       /* ... [load state using the hash value] ... */ 
       return true; 
      } 
      return false; 
     }, 250 
); 

を(appCacheは、アプリケーション変数を含む定義済みのオブジェクトであります)アイデアは、アプリケーション内のすべてのアクションをハッシュ値からトリガーすることです。まともなブラウザでは、ハッシュ値の変更によってIE(< = 7)の履歴にエントリが追加されます。すべてのブラウザで、別のハッシュ値を持つページに前後にナビゲートしても、ページが更新されるわけではありません。そこに、インターバルされた機能が引き継がれます。ハッシュ値の変更が検出されるたびに(プログラムで、または前または後ろをクリックして)、アプリは適切な処置をとることができます。アプリケーションはそれ自身の履歴を追跡することができ、アプリケーション(特にIEユーザー)に履歴ボタンを表示することができます。

私が言う通り、これはブラウザを越えて動作し、メモリやプロセッサのリソースに関してはコストがかかりません。だから私の質問です:これは、XHRアプリの歴史を管理するための実行可能なソリューションですか?長所と短所は何ですか?

更新:自分の自作フレームワークを使用しているため、私は既存のフレームワークの1つを使用したくありませんでした。 IEでlocation.hashを使用できるようにするには、あまりにも歴史がありますが、私は単純なスクリプト(iframeが必要です)を作成しました。私はon my siteを公開し、それを使用する/変更する/批判することを自由に感じる。

答えて

5

私はあなたが前進したか後ろに行ったかを知るのに厄介な時間があると思います。 urlが/ myapp#page1を開始すると、状態の追跡を開始します。 次に、ユーザーはurl/myapp#page2を作成するために何かを行います。 その後、ユーザーはurl/myapp#page1を再度作成します。今、彼らの歴史はあいまいで、あなたは何を取り除くべきかわからないでしょう。

ヒストリフレームワークはiframeを使用して、言及したブラウザの不一致を回避します。必要なブラウザでiframeを使用するだけで済みます。

もう1つの理由は、ユーザーがあなたのカスタム戻るボタンを押す前に、常にブラウザの戻るボタンを押すことです。私は250msごとに歴史を読むのが遅れていることも目立つだろうと感じています。おそらく間隔をもっと狭くすることもできますが、それで物事が悪くなるかどうかわかりません。

私はyuiの履歴マネージャーを使用していますが、すべてのブラウザー(特にie6)で常に完全に動作するわけではありませんが、多くのユーザーと開発者が使用しています。彼らが使用するパターンもかなり柔軟です。

+0

私はそれについて考えました。おそらく乱雑な歴史はアプリケーション制御の問題でもあります。つまり、ユーザーがアプリのどこにつながるかを確認して、自分の位置が常に明確です。 – KooiInc

8

ほとんどのソリューションで一緒にマングド取得する傾向がある3つの問題があります。

  1. window.location.hashベースのソリューションは、3つのすべてを解決することができます
  2. bookmarkability
  3. 更新ボタン

ボタンバックほとんどの場合:hashの値がアプリケーション/ Webページの状態にマップされるため、ユーザーは「戻る」/「進む」/「リフレッシュ」とジャムのいずれかを押すことができますpをハッシュの状態に戻します。アドレスバーの値が変更されたため、ブックマークすることもできます。 (ブラウザの履歴に影響を及ぼさないハッシュに関連してIEのためには、隠されたiframeが必要です)。

ただし、iframeのみのソリューションは、非常に効果的な解決策として、window.location.hashを監視せずに使用できます。

Googleマップはこれの素晴らしい例です。各ユーザーのアクションごとにキャプチャされた状態は、大きすぎてwindow.location.hash(マップ重心、検索結果、サテライト対マップビュー、情報ウィンドウなど)に配置できません。だから彼らは隠された形に埋め込まれた形に状態を保存するiframe。ちなみに、これは[ソフト]「リフレッシュ」問題も解決します。ブックマーク機能は「このページへのリンク」ボタンを使って個別に解決します。

私は、あなたが考えている問題のドメインを知っている/分離する価値があると思ったばかりです。

+0

実際には4つの問題があります。あなたは "状態"を逃した。 – T9b

2

すべてのブラウザは、すべてのブラウザをサポートするために重要ですが、うまくいけば、その必要性はなくなります。 IE8とFF3.6はどちらもonhashchangeのサポートを導入しました。私は他の人がスーツに従うと思います。タイムアウトやiframeを使用する前に、この機能が利用できるかどうかを確認することをお勧めします。これは実際にそこにある最も良い解決策です - で、IEでも動作します。

関連する問題