Impedisci il caricamento di safari dalla cache quando viene fatto clic sul pulsante Indietro

Hai riscontrato un problema con Safari che caricava vecchi video di YouTube quando si fa clic sul pulsante Indietro. Ho provato ad aggiungere onunload = “” (menzionato qui Prevenzione della cache sul pulsante di backup in Safari 5 ) al tag body ma non funziona in questo caso.

C’è un modo per impedire il caricamento di safari dalla cache su una determinata pagina?

Il tuo problema è causato dalla cache di back-forward . Si suppone di salvare lo stato completo della pagina quando l’utente si allontana. Quando l’utente torna indietro con il pulsante Indietro, la pagina può essere caricata dalla cache molto rapidamente. Questo è diverso dalla cache normale che memorizza solo il codice HTML.

Quando la pagina è caricata per l’evento onload bfcache, non verrà triggersto. Invece puoi controllare la proprietà persisted dell’evento onpageshow . È impostato su false al caricamento iniziale della pagina. Quando la pagina viene caricata da bfcache è impostata su true.

La soluzione Kludgish consiste nel forzare una ricarica quando la pagina viene caricata da bfcache.

 window.onpageshow = function(event) { if (event.persisted) { window.location.reload() } }; 

Se stai usando jQuery, allora fai:

 $(window).bind("pageshow", function(event) { if (event.originalEvent.persisted) { window.location.reload() } }); 

Sì, il browser Safari non gestisce la cache dei pulsanti indietro / indietro come per Firefox e Chrome. Specialmente iframes come i video di vimeo o di youtube sono memorizzati nella cache difficilmente nonostante ci sia un nuovo iframe.src.

Ho trovato tre modi per gestire questo. Scegli il meglio per il tuo caso. Soluzioni testate su Firefox 53 e Safari 10.1

1. Rileva se l’utente sta usando il pulsante Indietro / Avanti, quindi ricarica tutta la pagina o ricarica solo gli iframe memorizzati nella cache sostituendo lo src

 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. ricaricare l’intera pagina se la pagina è memorizzata nella cache

 window.onpageshow = function (event) { if (event.persisted) { window.location.reload(); } }; 

3. rimuovere la pagina dalla cronologia in modo che gli utenti non possano visitare nuovamente la pagina con i pulsanti Indietro / Avanti

 $(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 }); 

Tutte queste risposte sono un po ‘l’hack. Nei moderni browser (safari) solo sulla soluzione di onpageshow funziona,

 window.onpageshow = function (event) { if (event.persisted) { window.location.reload(); } }; 

ma su dispositivi lenti a volte si vedrà per una frazione di secondo la precedente visualizzazione cache prima che venga ricaricata. Un modo corretto per risolvere questo problema è impostare Cache-Control in modo corretto sulla risposta del server a un secondo

'Cache-Control', 'no-cache, max-age=0, must-revalidate, no-store'

Puoi usare un’ancora e osservare il valore della posizione del documento href;

Inizia con http://acme.co/ , aggiungi qualcosa alla posizione, come ‘#b’;

Quindi, ora il tuo URL è http://acme.co/#b , quando una persona preme il pulsante Indietro, torna a http://acme.co , e la funzione di controllo intervallo vede la mancanza del tag hash che imposta, cancella l’intervallo e carica l’URL di riferimento con un indicatore di data e ora.

Ci sono alcuni effetti collaterali, ma ti lascio per capirli;)

  

Questo non è stato verificato ma dovrebbe funzionare con un minimo aggiustamento.

Il comportamento è correlato alla cache Back / Forward di Safari. Puoi informarti sulla documentazione Apple pertinente: http://web.archive.org/web/20070612072521/http://developer.apple.com/internet/safari/faq.html#anchor5

Il suggerimento per la correzione di Apple è quello di aggiungere un iframe vuoto sulla tua pagina:

  

(Anche la precedente risposta accettata sembra valida, volevo solo fare il chip della documentazione e un’altra correzione potenziale)

Prima di tutto inserisci il campo nel tuo codice:

  

quindi eseguire jQuery:

 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(); } });