15

最近アクセスしたページに関する情報を格納するWebアプリケーションがあります。Aと呼びましょう。ユーザーがBと呼ばれる別のページタイプにアクセスすると、最後にアクセスしたAページを指すボタンが付いたメニューが上部に表示されます。Bページには、AページまたはBページのいずれかを介してアクセスでき、ユーザーはAのプロパティと見なすことができます。

これは正常に機能しますが、誰かが2つのタブを開き、AページA1へのリンクがあるタブ1のBページにいるときに、新しいタブを開いてAページA2にアクセスすると問題になります。次に、ユーザーがタブ1のBページを更新すると、メニューがA2に変わります。タブ1のA1を保存して、A2に変更されないように、使用されているタブを識別できるようにしたいと思います。

1つのタブを使用する場合:

A1 -> B1 -> B2 (the menu points back to A1)

2つのタブを使用する場合:

Time            | T1       | T2       | T3          
----------------+----------+----------+-------------
Tab 1:          | A1 -> B1 |          | [refresh B1]
Tab 2:          |          | A2 -> B3 |             
----------------+----------+----------+-------------
Menu points to: | A1    A1 | A2    A2 | A2

これにより、タブ1に戻ったユーザーが、A1ではなくタブ2(A2)で表示していたユーザーにアクセスすると混乱します。

ブラウザのタブIDを取得することはできませんが、誰かが回避策のアイデアを持っている可能性がありますか?

4

3 に答える 3

5

編集:時間の経過により、2012年からの私の最初の回答が不正確になりました。ベドリンが指摘しているように、Window.sessionStorageオブジェクトを使用できるようになりました。

sessionStorage プロパティを使用すると、現在のオリジンのセッション Storage オブジェクトにアクセスできます。sessionStorage は Window.localStorage に似ています。唯一の違いは、localStorage に保存されたデータには有効期限が設定されていないことです。sessionStorage に保存されたデータは、ページ セッションが終了すると消去されます。ページ セッションは、ブラウザーが開いている限り持続し、ページのリロードや復元後も存続します。新しいタブまたはウィンドウでページを開くと、新しいセッションが開始されます。これは、セッション Cookie の動作とは異なります。

元の回答 (2012):

ブラウザーのタブ ID のようなものを取得することができないことがわかったので、移植可能な方法でこれを行うことはできません。私の知る限り、HTML 標準はブラウザのタブをまったく認識していません。

私が考えることができる唯一の回避策は次のとおりです。アプリケーションにタブを実装して管理します。これを行ういくつかのビジネス Web アプリケーションを見てきましたが、(私見ですが) ユーザー エクスペリエンスはかなり悪いものです。

于 2012-09-27T11:04:12.630 に答える
0

だから私はかなりうまくいくように見える1つの解決策を作りました。最後の問題の箇条書きを参照してください。まだまだ良いアイデアをお待ちしておりますので、よろしければ教えてください!

ともかく; これが私がやった方法です。これは 100% 確実な解決策ではないことに注意してください。ユーザーが「不正行為」をして複数のタブを同時に更新すると、混乱する可能性があります。

base.html (すべてのページが継承します) ({{ A }} は Django から変数をレンダリングします):

// This is executed right before leaving the page
window.onunload = function() {
    if( '{{ A }}' != null ) 
        var prev_A = '{{ A }}';
    else if (typeof previous_A != 'undefined') {
        var prev_A = previous_A;
    else 
        var prev_A = '';
    localStorage.setItem('a', prev_A);
};
// Remove the local storage as soon as you get to this page
localStorage.removeItem('a');

B_base.html (すべての B の基本テンプレート。B_base.html も base.html を継承します。このコードを実行するために、base.html のコードの直前に配置します)

var previous_A = localStorage.getItem('a');

したがって、基本的に私が得たのは、最初に「a」をローカルとして保存するBページを除いて、すべてのページがページを離れるときにlocalStorage 'a'を設定し、ページに入るとすぐにlocalStorage 'a'を削除することです変数を削除する前に。

問題:

  • 同時に複数のタブでリンクを開くと、この変数が上書きされ、1 つのタブには previous_A がなくなります。
  • どこにも移動せずに A タブを閉じてから、新しい B ページを直接開くと、B タブの previous_A に閉じた A の値が含まれます。
  • Aページから新しいタブでBリンクを開いても、リンクが返されません...これはディールブレーカーです。
于 2012-09-27T12:00:33.913 に答える