Samstag, 16. Januar 2010

Seite neu und nicht aus dem Cache laden beim Betätigen des Zurück-Buttons

Unter bestimmten Umständen will man erreichen, dass eine dynamisch erzeugte Seite nicht gecacht, sondern bei jedem Aufruf neu geladen wird. Insbesondere, wenn man sich mit den Vor- und Zurück-Buttons in der Browser-History hin- und herbewegt.

Ein Anwendungsbeispiel wäre etwa eine Anmeldemaske, die mit AJAX funktioniert. Man meldet sich auf einer Seite per AJAX an und klickt dann auf den Zurück-Button. Wenn der Browser die Seite nun aus dem Cache zieht, dann sieht es für den User aus, als wäre er doch noch nicht eingeloggt. Erst ein manuelles Neuladen würde hier helfen.

Ein weiteres Beispiel wäre etwa die Warenkorbanzeige in einem Shop. Wir legen auf der Produktdetailseite ein Produkt in den Warenkorb und klicken anschließend auf den Zurückbutton, um auf die Übersichtsseite mit den anderen Produkten zurückzukehren. Lädt der Browser die gecachte Version, so bekommen wir hier den alten Warenkorb angezeigt. Das ist zwar nicht falsch, aber Usability-technisch unschön.

Wie kann man das Neuladen also erzwingen? Die Frage stellte sich mir kürzlich bei Usability-Tests eines größeren Projekts. Bei der Suche nach einer Antwort bin ich zunächst auf einige HTML-Tags für den HEAD-Bereich gestoßen:

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="expires" content="-1">

Interessanterweise hat das meinen IE8 nicht davon abgehalten, die Seite trotzdem aus dem Cache zu laden. Also mussten schwerere Geschütze aufgefahren werden. Fündig wurde ich in einem Munitionsbunker auf php.net, genauer gesagt auf der Doku-Seite der header()-Funktion:

<?php
header("Cache-Control: no-cache, must-revalidate"); // HTTP/1.1
header("Expires: Sat, 26 Jul 1997 05:00:00 GMT"); // Datum in der Vergangenheit
?>

Vereinfacht betrachtet bewirken diese zwei Codezeilen das Gleiche, was die Meta-Tags von oben auch hätten tun sollten, nämlich dem Browser mitzuteilen, dass ein Caching nicht erwünscht ist. Dies erfolgt durch HTTP-Header, die dem Browser durch die explizite Anweisung "no-cache, must revalidate" und einem Verfallsdatum in der Vergangenheit klarmachen, dass die Seite neu geladen werden muss. So klappt es auch mit dem Internet Explorer.

Keine Kommentare: