Ist es möglich, den AJAX-Seitenstatus über Klicks auf die ZURÜCK-Schaltfläche hinweg beizubehalten (ohne neu zu laden)?

Question

Ich kenne verschiedene Ansätze, um die Zurück-Schaltfläche in AJAX-Anwendungen in verschiedenen Situationen zum Funktionieren zu bringen, habe jedoch keine Lösung gefunden, die in meinem speziellen Szenario ordnungsgemäß funktioniert.

Die Seiten, mit denen ich arbeite, sind die Suchoberfläche für eine Website.Sie geben Begriffe in ein normales Suchfeld ein, klicken auf „Los“ und gelangen auf eine Suchergebnisseite.Auf der Suchergebnisseite gibt es zahlreiche UI-Steuerelemente zum Filtern/Sortieren der Suchergebnisse, um das Gesuchte zu finden.Einige der durch diese Steuerelemente ausgelösten Vorgänge können (relativ) lange dauern (z. B.mehrere Sekunden).

Diese Latenz ist in Ordnung, wenn der Benutzer seine Ergebnisse zunächst filtert/sortiert ...Es gibt einen schönen AJAX-Spinner und so weiter ...Wenn der Benutzer jedoch auf ein Suchergebnis und dann auf die Schaltfläche „ZURÜCK“ klickt, möchte ich, dass die Seite sofort in dem Zustand wiederhergestellt wird, in dem sie sich befand, als sie darauf klickte.

Ich kann die Zustände mithilfe von IFRAMEs/Fragmentbezeichnern als Wörterbuch des Seitenverlaufs wiederherstellen, aber was am Ende passiert, ist, dass, wenn der Benutzer zum ersten Mal auf die Schaltfläche „Zurück“ klickt, die ursprüngliche Seite geladen wird und dann die AJAX-Abfrage (erneut) durchführt, um die zu erhalten Seitenstatus zurück, was den AJAX-Spinner und eine weitere Wartezeit von möglicherweise mehreren Sekunden auslöst.

Gibt es einen Ansatz, der dieses zweistufige Laden der Seite nicht erfordert, wenn der Benutzer über die Schaltfläche „ZURÜCK“ zur Seite zurückkehrt?

Bearbeitet, um Folgendes hinzuzufügen:Ich habe eine Vorliebe für Jquery, würde mich aber über Lösungen freuen, die von anderen Bibliotheken/Toolkits abhängen oder eigenständiges/unformatiertes Javascript sind.

Bearbeitet, um Folgendes hinzuzufügen:Ich hätte hinzufügen sollen, dass ich versuche, Cookies/Sitzungen zu vermeiden, da dies verhindert, dass Benutzer mehrere Browserfenster/Registerkarten geöffnet haben und gleichzeitig verschiedene Suchergebnisse bearbeiten.

Bearbeiten:Matt, können Sie Ihre vorgeschlagene Lösung näher erläutern (Auslösen eines Seitenwechselereignisses über die Fragment-ID)?Ich sehe, wie dies helfen würde, wenn auf derselben Seite auf die Schaltfläche „Zurück“ geklickt wird, aber nach dem Klicken auf ein bestimmtes Ergebnis nicht zur Suchergebnisseite zurückgekehrt wird.

Answer 1

Versuchen zu benutzen lokaler Speicher Objekt.Hier sind Crossbrower-Bibliotheken jStorage Und WEBSHIMS JSON-Speicher

Answer 2

Benutzen Sie einfach a Plätzchen.

Answer 3

Haben Sie das untersucht? YUI-Browserverlaufsmanager?

Answer 4

Wäre es hilfreich, ein Seitenwechselereignis mithilfe des Ansatzes „Einige Informationen zum # am Ende der URL hinzufügen“ auszulösen?

Auf diese Weise sollte das Klicken auf die Schaltfläche „Zurück“ die Seite nicht wirklich ändern und Sie sollten in der Lage sein, den Status wiederherzustellen, ohne dass die erste Seite geladen werden muss.

Answer 5

Verwenden Sie etwas Dauerhaftes, das mit dem Profil des Benutzers verknüpft ist.

Cookies und Sitzungen sind gute Ideen, aber Sie können diese Dinge auch in der Datenbank behalten.Dies bietet Ihnen den zusätzlichen Vorteil, dass Sie die Filtereinstellungen des Benutzers über verschiedene Browsersitzungen hinweg speichern können (wenn er beispielsweise im Büro nach etwas gesucht hat und dann beschließt, die Suche fortzusetzen, wenn er wieder zu Hause ist).

Es hängt alles von der Komplexität der Filter ab und davon, ob es etwas ist, von dem Sie glauben, dass der Benutzer es in verschiedenen Browsersitzungen verwenden möchte.

Answer 6

Bearbeitet, um Folgendes hinzuzufügen:Ich hätte hinzufügen sollen, dass ich versuche, Cookies/Sitzungen zu vermeiden, da dies verhindert, dass Menschen mit mehreren Sockern/Registerkarten verschiedene Suchergebnisse gleichzeitig geöffnet und manipulieren.

Sie können ein zufälliges Token erstellen und es der Fragment-ID zuweisen.

• Erstellen Sie beim Laden der ersten Seite ein Token, wenn keine Fragment-ID festgelegt ist
• Speichern Sie vor der Navigation alle temporären Ajax-Daten in einem Cookie mit diesem Token als Index.
• Wenn Sie beim Zurückschlagen eine Fragment-ID festgelegt haben, laden Sie die Daten aus dem entsprechenden Token im Cookie.
• Sie können sogar ein „Zeit“-Feld hinzufügen, um Token usw. ablaufen zu lassen.

Beispiel-Cookie (JSON):

{"ajaxcache":[{"token":<token>,"time":<time>,"data":<data>}, ... ]}