Risposte:
Una soluzione comune e semplice a questo problema che sembra un hack ma è abbastanza portabile è aggiungere una stringa di query generata in modo casuale a ciascuna richiesta per l'immagine dinamica.
Quindi, ad esempio -
<img src="image.png" />Potrebbe diventare
<img src="image.png?dummy=8484744" />O
<img src="image.png?dummy=371662" />Dal punto di vista del web-server si accede allo stesso file, ma dal punto di vista del browser non è possibile eseguire operazioni di caching.
La generazione di numeri casuali può avvenire sul server durante il servizio della pagina (assicurati solo che la pagina stessa non sia memorizzata nella cache ...) o sul client (utilizzando JavaScript).
Dovrai verificare se il tuo server web può far fronte a questo trucco.
Le strategie di memorizzazione nella cache del browser possono essere controllate dalle intestazioni HTTP. Ricorda che sono solo un suggerimento, davvero. Poiché i browser sono terribilmente incoerenti in questo (e in qualsiasi altro) campo, avrai bisogno di diverse intestazioni per ottenere l'effetto desiderato su una gamma di browser.
header ("Pragma-directive: no-cache");
header ("Cache-directive: no-cache");
header ("Cache-control: no-cache");
header ("Pragma: no-cache");
header ("Expires: 0");Se devi farlo dinamicamente nel browser utilizzando javascript, ecco un esempio ...
<img id=graph alt=""
src="http://www.kitco.com/images/live/gold.gif"
/>
<script language="javascript" type="text/javascript">
var d = new Date();
document.getElementById("graph").src =
"http://www.kitco.com/images/live/gold.gif?ver=" +
d.getTime();
</script>La soluzione 1 non è eccezionale.Funziona, ma l'aggiunta di stringhe di query casuali o con timestamp alla fine dei file di immagine farà sì che il browser scarichi nuovamente e memorizzi nella cache ogni versione di ogni immagine, ogni volta che una pagina viene caricata, indipendentemente dal tempo in cui l'immagine è cambiata o meno sul server.
La soluzione 2 è inutile. L'aggiunta di nocacheintestazioni a un file di immagine non è solo molto difficile da implementare, ma è completamente impraticabile perché richiede di prevedere in anticipo quando sarà necessario , la prima volta che carichi un'immagine che pensi possa cambiare in futuro .
Il modo migliore in assoluto che ho trovato per risolvere questo problema è utilizzare ETAGS all'interno di un file .htaccess nella directory delle immagini. Quanto segue dice ad Apache di inviare un hash univoco al browser nelle intestazioni del file immagine. Questo hash cambia sempre e solo quando il file immagine viene modificato e questa modifica attiva il browser per ricaricare l'immagine la volta successiva che viene richiesta.
<FilesMatch "\.(jpg|jpeg)$">
FileETag MTime Size
</FilesMatch>Ho controllato tutte le risposte e la migliore sembrava essere (che non lo è):
<img src="image.png?cache=none">All'inizio.
Tuttavia, se aggiungi cache = none parametro (che è una parola statica "none"), non ha alcun effetto, il browser viene comunque caricato dalla cache.
La soluzione a questo problema era:
<img src="image.png?nocache=<?php echo time(); ?>">dove fondamentalmente aggiungi timestamp unix per rendere il parametro dinamico e senza cache, ha funzionato.
Tuttavia, il mio problema era leggermente diverso: stavo caricando al volo l'immagine del grafico php generato e controllando la pagina con i parametri $ _GET. Volevo che l'immagine venisse letta dalla cache quando il parametro URL GET rimane lo stesso e non la cache quando i parametri GET cambiano.
Per risolvere questo problema, avevo bisogno di hash $ _GET ma poiché è un array, ecco la soluzione:
$chart_hash = md5(implode('-', $_GET));
echo "<img src='/images/mychart.png?hash=$chart_hash'>";Modifica :
Sebbene la soluzione di cui sopra funzioni bene, a volte si desidera fornire la versione memorizzata nella cache FINO A CHE il file non viene modificato. (con la soluzione di cui sopra, disabilita completamente la cache per quell'immagine) Quindi, per servire l'immagine memorizzata nella cache dal browser FINO A CHE non ci sia una modifica nell'uso del file immagine:
echo "<img src='/images/mychart.png?hash=" . filemtime('mychart.png') . "'>";filemtime () ottiene l'ora di modifica del file.
So che questo argomento è vecchio, ma si classifica molto bene su Google. Ho scoperto che l'inserimento di questo nella tua intestazione funziona bene;
<meta Http-Equiv="Cache-Control" Content="no-cache">
<meta Http-Equiv="Pragma" Content="no-cache">
<meta Http-Equiv="Expires" Content="0">
<meta Http-Equiv="Pragma-directive: no-cache">
<meta Http-Equiv="Cache-directive: no-cache">Stavo solo cercando una soluzione a questo e le risposte sopra non hanno funzionato nel mio caso (e non ho una reputazione sufficiente per commentarle). Si scopre che, almeno per il mio caso d'uso e il browser che stavo utilizzando (Chrome su OSX), l'unica cosa che sembrava impedire il caching era:
Cache-Control = 'no-store'Per completezza ora sto usando tutti e 3 i "no-cache, no-store, must-revalidate"
Quindi nel mio caso (che serve immagini generate dinamicamente da Flask in Python), ho dovuto fare quanto segue per poter lavorare con il maggior numero di browser possibile ...
def make_uncached_response(inFile):
response = make_response(inFile)
response.headers['Pragma-Directive'] = 'no-cache'
response.headers['Cache-Directive'] = 'no-cache'
response.headers['Cache-Control'] = 'no-cache, no-store, must-revalidate'
response.headers['Pragma'] = 'no-cache'
response.headers['Expires'] = '0'
return responseCambiare l'origine dell'immagine è la soluzione. Puoi effettivamente farlo aggiungendo un timestamp o un numero casuale all'immagine.
Sarebbe meglio aggiungere un checksum, ad esempio, ai dati rappresentati dall'immagine. Ciò abilita la memorizzazione nella cache quando possibile.
Aggiungiamo un'altra soluzione al gruppo.
Aggiungere una stringa univoca alla fine è una soluzione perfetta.
example.jpg?646413154La seguente soluzione estende questo metodo e fornisce sia la capacità di memorizzazione nella cache sia il recupero di una nuova versione quando l'immagine viene aggiornata.
Quando l'immagine viene aggiornata, il filemtime verrà modificato.
<?php
$filename = "path/to/images/example.jpg";
$filemtime = filemtime($filename);
?>Ora visualizza l'immagine:
<img src="images/example.jpg?<?php echo $filemtime; ?>" >ho avuto questo problema e il superamento in questo modo.
var newtags='<div class="addedimage"><h5>preview image</h5><img src="'+one+'?nocache='+Math.floor(Math.random() * 1000)+'"></div>';L'ho usato per risolvere il mio problema simile ... visualizzare un contatore di immagini (da un provider esterno). Non si aggiornava sempre correttamente. E dopo che è stato aggiunto un parametro casuale, tutto funziona bene :)
Ho aggiunto una stringa di data per garantire l'aggiornamento almeno ogni minuto.
codice di esempio (PHP):
$output .= "<img src=\"http://xy.somecounter.com/?id=1234567890&".date(ymdHi)."\" alt=\"somecounter.com\" style=\"border:none;\">";Ciò si traduce in un srccollegamento come:
http://xy.somecounter.com/?id=1234567890&1207241014Se hai un URL immagine hardcoded, ad esempio: http://example.com/image.jpg puoi usare php per aggiungere intestazioni alla tua immagine.
Per prima cosa dovrai fare in modo che apache elabori il tuo jpg come php. Vedi qui: È possibile eseguire PHP con estensione file.php.jpg?
Carica l'immagine (imagecreatefromjpeg) dal file quindi aggiungi le intestazioni dalle risposte precedenti. Usa l'intestazione della funzione php per aggiungere le intestazioni.
Quindi visualizza l'immagine con la funzione imagejpeg.
Si noti che è molto insicuro lasciare che php elabori le immagini jpg. Inoltre, tieni presente che non ho testato questa soluzione, quindi spetta a te farlo funzionare.
Semplice, invia una posizione di intestazione.
Il mio sito, contiene un'immagine, e dopo aver caricato l'immagine, non cambia, quindi aggiungo questo codice:
<?php header("Location: pagelocalimage.php"); ?>Per me va bene.