2012-10-25 17 views
6

Sul mio sito di prodotto, Firefox a volte "non rileva" le modifiche nel mio codice JavaScript JavaScript &. Piuttosto carica le vecchie versioni, quindi sembra che ho bisogno di cancellare la cache. In una situazione come questa, cosa dovrei fare? Si riferisce all'ultimo Firefox (16.0.1 al momento della stesura di questo documento)Perché Firefox a volte memorizza nella cache il mio codice CSS e Javascript, anche se è cambiato?

EDIT!

Ho dimenticato di dire errori per i file css del localhost. Intendevo, c'è un vecchio file js, lo aggiorno, lo carica e sul server del prodotto firefox pensa che sia il file localhost. Il mio modo di includere i file:

<link rel="stylesheet" href="/xyz.css" type="text/css" /> 

risposta

10

Se si utilizza un linguaggio sul lato server è possibile utilizzare un trucco. È possibile aggiungere una stringa dopo .css/.js. In PHP, ad esempio:

<link rel="stylesheet" type="text/css" href="/style.css?t=<?= time(); ?>" /> 

Cambia ogni pagina ricaricata.

Dai un'occhiata a questo articolo su cache busting.

+2

Questo (Cache-busting) è di gran lunga l'approccio migliore! – nickhar

+2

Oh si! Funziona ... ma in produzione potrebbe velocizzare la pagina caricando – jan267

+2

Vero, ho sempre applicato solo i numeri di versione in produzione, ma dev-enviro è un must :) – nickhar

9

È possibile utilizzare una tecnica chiamata "cache busting" in cui si allega una stringa di query per la chiamata al file css/js. Quindi aggiorni la stringa di query ogni volta che aggiorni il tuo css/js.

Esempio:

<link rel="stylesheet" type="text/css" href="/styles.css?ver=1" /> 
2

È possibile aggiungere una versione al termine dei js css/inviati dall'altra parte.

Per esempio

Invece di www.foo.com/js/javascript.js, inviare www.foo.com/js/javascript.js?v=1 e
Invece di www.foo.com/css/style.css, inviare www.foo.com/css/style.js?v=1

1

ottenuto appena chiara la cache o il disco di aggiornamento (Ctrl + F5) Ho paura.

Un'altra opzione è semplicemente modificare il nome del file JS o CSS in modo che FF non lo riconosca come file memorizzato nella cache (ad esempio, rinomina style.css in style2.css).

1

style.css?randomnumber sarà asure il carico

2
  • È possibile utilizzare un meta tag per forzare il rinfrescante. <meta http-equiv="Cache-control" content="no-cache"> o <meta http-equiv="pragma" content="no-cache">.
  • È possibile forzare l'intestazione HTTP: Cache-control: no-cache o Pragma: no-cache.
  • È possibile aggiungere una stringa di query casuale ai file CSS e JavaScript.
+1

La no cache non è l'opzione migliore per le prestazioni. Avrai un colpo alla velocità della pagina. –

+1

Sono d'accordo con te su questo, sire. – Tim

3

Come detto in molte altre risposte che si desidera avere un identificatore univoco per le risorse statiche in base al contenuto vale a dire i cambiamenti identificatore se e solo se il contenuto cambia. In questo modo i browser possono ancora utilizzare una versione cache di una risorsa purché il contenuto non sia cambiato, il che è esattamente ciò che desideri. Questa tecnica è denominata controllo delle proprietà statiche.

Quindi non utilizzare l'ora corrente o un numero/stringa casuale. Se è possibile, utilizzare il tempo di modifica del file o (meglio) l'hash MD5 del suo contenuto. È possibile aggiungere questo identificatore come stringa di query (che verrà ignorata) o (better) aggiungendolo al nome file prima dell'estensione.

Per contrastare questo con e deselezionare la confusione circa la tecnica di cache busting menzionato in alcune altre risposte: busting della cache è una tecnica utilizzata dagli inserzionisti per forzare il browser a ricaricare sempre una risorsa in modo l'inserzionista può misurare il numero di impressioni dell'annuncio per il numero di volte in cui viene richiesta la risorsa. Questo è facilmente realizzabile usando un numero casuale. È normalmente si desidera utilizzare questo per le risorse statiche.

Problemi correlati