Store browser tab spezifische Daten

Question

Ich habe eine Webanwendung, die Informationen über kürzlich besuchte Seiten speichern, nennen wir sie A. Wenn ein Benutzer einen anderen Seitentyp, genannt B, besucht, rendere ich oben ein Menü mit einer Schaltfläche, auf die verwiesen wird die zuletzt besuchte A-Seite. Die B-Seiten sind entweder durch eine A-Seite oder B-Seite und können vom Benutzer eine Eigenschaft von A. betrachtet werden

Dies funktioniert gut, aber es wird zu einem Problem, wenn jemand zwei Registerkarten öffnet und wenn sein auf einem B -Seite in Tab 1 mit einem Link zur A-Seite A1 öffnen sie einen neuen Tab und besuchen die A-Seite A2. Wenn der Benutzer die B-Seite in Tab 1 aktualisiert, ändert sich das Menü in A2. Ich möchte in der Lage zu identifizieren, welche Registerkarte verwendet wird, so dass ich A1 für Registerkarte 1 speichern kann, so dass es nicht in A2 geändert wird.

Bei Verwendung einer Lasche:

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

Wenn zwei Tabs:

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

Dies verwirrt die Benutzer, wenn sie zurück in Tab 1 dem Benutzer kommt sie in Tab Betrachtung wurden 2 (A2) anstelle von A1.

Ich habe Angst, dass es nicht möglich ist, die Browser-Registerkarte ID zu erhalten, aber jemand könnte Ideen für eine Problemumgehung haben?

Answer 1

Bearbeiten: Der Lauf der Zeit hat meine ursprüngliche Antwort von 2012 falsch gemacht. Wie Bedrin weist darauf hin, können Sie verwenden jetzt die Window.sessionStorage object:

Die session Eigenschaft Sie eine Session Storage-Objekt für den aktuellen Ursprung zugreifen können. sessionStorage ähnelt Window.localStorage. Der einzige Unterschied besteht darin, dass Daten, die in localStorage gespeichert sind, kein Ablaufdatum haben. Die in sessionStorage gespeicherten Daten werden gelöscht, wenn die Seitensitzung beendet wird. Eine Seitensitzung dauert so lange, wie der Browser geöffnet ist und über Seiten neu geladen und wiederhergestellt wird. Beim Öffnen einer Seite in einer neuen Registerkarte oder einem neuen Fenster wird eine neue Sitzung initiiert, die sich von der Funktionsweise der Sitzungscookies unterscheidet.

Original-Antwort (2012):

ich fürchte, das in einem tragbaren Weise nicht möglich sein wird, wie Sie herausgefunden haben, selbst nicht möglich ist, so etwas wie ein Browser-Tab-ID abzurufen . Die HTML-Standards sind meines Wissens den Tabs in Browsern völlig unbekannt.

Die einzige Problemumgehung, die ich denken kann, wäre dies: Implementieren und verwalten Sie Registerkarten in Ihrer Anwendung. Ich habe mehrere Business-Web-Anwendungen gesehen, die das tun, aber (imho) die Benutzererfahrung ist ziemlich schlecht.

Answer 2

Also habe ich eine Lösung gemacht, die scheint ziemlich gut zu funktionieren NO IT DOESNT. Siehe das letzte Problem-Bullet. Ich hoffe immer noch auf bessere Ideen, also lassen Sie es mich bitte wissen, wenn Sie sich verstanden haben!

Wie auch immer; Hier ist, wie ich es gemacht habe. Denken Sie daran, dass dies keine 100% ig narrensichere Lösung ist, wenn sich ein Benutzer "falsch verhält" und mehrere Registerkarten gleichzeitig aktualisiert, kann es zu Verwirrung kommen:

Basis.html (die alle Seiten erbt) ({{A}} rendert eine Variable aus 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 (die Basis-Vorlage aller B B_base.html erbt auch base.html. ich habe diesen Code nur vor dem Code in base.html)

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

Also im Grunde auszuführen, was ich bekommen ist, dass jede Seite die localstorage setzt ‚a‘, wenn er verlässt die Seite und löscht die localstorage ‚a‘ als sobald es die Seite betritt, mit Ausnahme der B-Seiten, die zuerst 'a' als lokale Variable speichern, bevor sie gelöscht werden.

Probleme:

• Öffnungs Links in mehreren Tabs gleichzeitig wird diese Variable überschreiben und eine Lasche ohne previous_A sein wird.
• Schließen einer A-Registerkarte, ohne irgendwo zu gehen, dann öffnen Sie eine neue B-Seite direkt wird dazu führen, dass die B-Registerkarte hat den geschlossenen A-Wert in seiner vorherigen_A.
• Offene B-Links in neuen Tabs von A-Seite gibt ihnen nicht den Link zurück ... Dies ist der Dealbreaker.

Answer 3

HTML5 sessionStorage löst dieses Problem:

Seiten können Daten an den Sitzungsspeicher hinzuzufügen, und es wird zu einem beliebigen Seite aus dem gleichen Ort in diesem Fenster geöffnet zugänglich sein.

Es ist supported by all modern browsers

Ein weiterer Ansatz ist window.name Eigenschaft zu verwenden. Es ist tab-/window-spezifisch und bleibt bei der Browser-Navigation unverändert. So können Sie einige König der Registerkarte ID in Ihrem window.name Eigentum speichern