Tipps und Tricks zu den Themen: Software- und Webentwicklung

Sonntag, 21. Juli 2013

Browserverlauf bei AJAX-Inhalten

Eines der größten Nachteile den die AJAX-Technologie mit sich bringt, ist der fehlende Browserverlauf sobald Seiteninhalte dynamisch nachgeladen werden. Daher kann der Seitenbesucher den "Zurück"-Button im Browser (oder andere Verlaufsfunktionen) nicht wie gewohnt nutzen. Eine Webseite kann dieses Verhalten jedoch nachträglich ergänzen indem der Browserverlauf explizit gesetzt wird sobald AJAX-Inhalte nachgeladen werden. Zudem muss ein Event-Listener an den Browserverlauf verknüft werden, damit im Falle der Betätigung der "Zurück"-Funktion das Event abgefangen wird und entsprechend an die eigene AJAX-Funktion, die sämtliche Inhalte lädt, umgeleitet wird (Callback).

Hier ein Beispiel für eine Funktion, die per AJAX Inhalte dynamisch lädt und einen Eintrag im Browserverlauf setzt: Zur Einfachheit wurde im oberen Beispiel auf die jQuery-Kurzschreibweise eines AJAX-Request zurückgegriffen, die alternativ durch eine eigene Implementation mithilfe des XMLHttpRequest-Objektes ersetzt werden kann.

Eine einfache Möglichkeit die Funktion "loadAjaxContent" über einen Link anzusteuern: Damit der Browserverlauf vom Seitenbesucher durchlaufen werden kann, muss dieser mit einem Listener umgeleitet werden (Callback): Hierbei muss darauf geachtet werden, dass nicht erneut ein Eintrag in den Browserverlauf gesetzt wird, falls der Besucher in diesem Verlauf navigiert. Dies lässt sich mit dem Funktionsparameter "pushState" steuern.



Keine Kommentare:

Kommentar veröffentlichen