Beim Laden alter YouTube-Videos beim Klicken auf die Schaltfläche "Zurück" wurde ein Problem mit der Safari behoben. Ich habe versucht, onunload = "" (hier erwähnt Verhindern des Cache auf der Zurück-Schaltfläche in Safari 5 ) zum Body-Tag hinzuzufügen, aber dies funktioniert in diesem Fall nicht.
Gibt es eine Möglichkeit, das Laden von Safari aus dem Cache auf einer bestimmten Seite zu verhindern?
javascript
caching
safari
back-button
Mark Steggles
quelle
quelle
Antworten:
Ihr Problem wird durch den Back-Forward-Cache verursacht . Es soll den vollständigen Status der Seite speichern, wenn der Benutzer weg navigiert. Wenn der Benutzer mit der Zurück-Schaltfläche zurück navigiert, kann die Seite sehr schnell aus dem Cache geladen werden. Dies unterscheidet sich vom normalen Cache, der nur HTML-Code zwischenspeichert.
Wenn die Seite für das bfcache-
onload
Ereignis geladen wird, wird dies nicht ausgelöst. Stattdessen können Sie diepersisted
Eigenschaft desonpageshow
Ereignisses überprüfen . Es wird beim ersten Laden der Seite auf false gesetzt. Wenn die Seite aus dem bfcache geladen wird, wird sie auf true gesetzt.Die kludgische Lösung besteht darin, ein erneutes Laden zu erzwingen, wenn die Seite aus dem bfcache geladen wird.
window.onpageshow = function(event) { if (event.persisted) { window.location.reload() } };
Wenn Sie jQuery verwenden, gehen Sie wie folgt vor:
$(window).bind("pageshow", function(event) { if (event.originalEvent.persisted) { window.location.reload() } });
quelle
window.location = window.location
stattdessen verwendenwindow.location.reload()
, aus Gründen, von denen ich annehme, dass sie im Nebel der Zeit verloren sind.Alle diese Antworten sind ein bisschen Hack. In modernen Browsern (Safari) nur auf
onpageshow
Lösungsarbeit,window.onpageshow = function (event) { if (event.persisted) { window.location.reload(); } };
Bei langsamen Geräten wird jedoch manchmal für einen Sekundenbruchteil die vorherige zwischengespeicherte Ansicht angezeigt, bevor sie erneut geladen wird. Der richtige Weg, um dieses Problem zu lösen, besteht darin, die Cache-Steuerung für die Serverantwort auf einen Balg richtig einzustellen
'Cache-Control', 'no-cache, max-age=0, must-revalidate, no-store'
quelle
Ja, der Safari-Browser verarbeitet den Cache für Zurück- / Vorwärtsschaltflächen nicht wie Firefox und Chrome. Insbesondere iframes wie vimeo oder youtube videos werden kaum zwischengespeichert, obwohl es eine neue iframe.src gibt.
Ich habe drei Möglichkeiten gefunden, damit umzugehen. Wählen Sie das Beste für Ihren Fall. Auf Firefox 53 und Safari 10.1 getestete Lösungen
1. Ermitteln Sie, ob der Benutzer die Schaltfläche Zurück / Vorwärts verwendet, und laden Sie dann die gesamte Seite neu oder laden Sie nur die zwischengespeicherten Iframes neu, indem Sie den src ersetzen
if (!!window.performance && window.performance.navigation.type === 2) { // value 2 means "The page was accessed by navigating into the history" console.log('Reloading'); //window.location.reload(); // reload whole page $('iframe').attr('src', function (i, val) { return val; }); // reload only iframes }
2. Laden Sie die gesamte Seite neu, wenn die Seite zwischengespeichert ist
window.onpageshow = function (event) { if (event.persisted) { window.location.reload(); } };
3. Entfernen Sie die Seite aus dem Verlauf, damit Benutzer die Seite nicht über die Schaltflächen Zurück / Vorwärts erneut aufrufen können
$(function () { //replace() does not keep the originating page in the session history, document.location.replace("/Exercises#nocache"); // clear the last entry in the history and redirect to new url });
quelle
Sie können einen Anker verwenden und den Wert des Speicherorts des Dokuments href beobachten.
Beginnen Sie mit
http://acme.co/
, hängen Sie etwas an den Speicherort an, z. B. '#b';So, jetzt Ihre URL ist
http://acme.co/#b
, wenn eine Person die Zurück - Taste trifft, geht es zurück zuhttp://acme.co
, und das Intervall - Check - Funktion sieht das Fehlen des Hash - Tag setzen wir, löscht das Intervall, und lädt die Referrer - URL mit einem Zeitstempel angehängt dazu.Es gibt einige Nebenwirkungen, aber ich überlasse es Ihnen, diese herauszufinden;)
<script> document.location.hash = "#b"; var referrer = document.referrer; // setup an interval to watch for the removal of the hash tag var hashcheck = setInterval(function(){ if(document.location.hash!="#b") { // clear the interval clearInterval(hashCheck); var ticks = new Date().getTime(); // load the referring page with a timestamp at the end to avoid caching document.location.href.replace(referrer+'?'+ticks); } },100); </script>
Dies ist nicht getestet, sollte aber mit minimalen Anpassungen funktionieren.
quelle
Das Verhalten hängt mit dem Back / Forward-Cache von Safari zusammen. Informationen dazu finden Sie in der entsprechenden Apple-Dokumentation: http://web.archive.org/web/20070612072521/http://developer.apple.com/internet/safari/faq.html#anchor5
Apples eigener Fixvorschlag besteht darin, Ihrer Seite einen leeren Iframe hinzuzufügen:
<iframe style="height:0px;width:0px;visibility:hidden" src="about:blank"> this frame prevents back forward cache </iframe>
(Die zuvor akzeptierte Antwort scheint ebenfalls gültig zu sein, wollte nur die Dokumentation und eine weitere mögliche Lösung einbinden.)
quelle
Fügen Sie zunächst ein Feld in Ihren Code ein:
<input id="reloadValue" type="hidden" name="reloadValue" value="" />
Führen Sie dann jQuery aus:
jQuery(document).ready(function() { var d = new Date(); d = d.getTime(); if (jQuery('#reloadValue').val().length == 0) { jQuery('#reloadValue').val(d); jQuery('body').show(); } else { jQuery('#reloadValue').val(''); location.reload(); } });
quelle
Es gibt viele Möglichkeiten, den bfcache zu deaktivieren. Am einfachsten ist es, einen "Entlade" -Handler festzulegen. Ich denke, es war ein großer Fehler, die Handler 'entladen' und 'vor dem Entladen' den bfcache deaktivieren zu lassen, aber genau das haben sie getan (wenn Sie einen dieser Handler haben möchten und den bfcache trotzdem funktionieren lassen möchten, können Sie den Handler vor dem Entladen entfernen der Beforeunload-Handler).
window.addEventListener('unload', function() {})
Lesen Sie hier mehr:
https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/1.5/Using_Firefox_1.5_caching
quelle
Ich hatte das gleiche Problem mit der Verwendung von 3 verschiedenen Ankerlinks zur nächsten Seite. Wenn Sie von der nächsten Seite zurückkehren und einen anderen Anker auswählen, hat sich der Link nicht geändert.
so hatte ich
<a href="https://www.example.com/page-name/#house=house1">House 1</a> <a href="https://www.example.com/page-name/#house=house2">View House 2</a> <a href="https://www.example.com/page-name/#house=house3">View House 3</a>
Gewechselt zu
<a href="/page-name#house=house1">House 1</a> <a href="/page-name#house=house2">View House 2</a> <a href="/page-name#house=house3">View House 3</a>
Auch zur Sicherheit verwendet:
// Javascript window.onpageshow = function(event) { if (event.persisted) { window.location.reload() } }; // JQuery $(window).bind("pageshow", function(event) { if (event.originalEvent.persisted) { window.location.reload() } });
Keine der online gefundenen Lösungen zum Entladen, Neuladen und Neuladen (true) funktionierte einzeln nicht. Hoffe das hilft jemandem mit der gleichen Situation.
quelle