Přidat otázku mezi oblíbenéZasílat nové odpovědi e-mailemVyřešeno HTML/PHP - jak zakázat načítání obrázku z cache?

Zdravím vespolek,
řeším následující problém: na www stránce je obrázek, jako upoutávka na nějakou akci - akce.jpg. Tento obrázek se bude měnit, podle toho, jaká bude zrovna akce na nějaké zboží. Takže uživatel vždy přes FTP nahraje (přepíše) nový soubor akce.jpg.

Když ale nahraju přes FTP nový obrázek, zavřu prohlížeč, otevřu prohlížeč a znovu stránku zobrazím, stále tam je ten původní starý obrázek. Teprve po obnovení klávesou F5 se načte nový obrázek.

V hlavičce mám toto:

<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Cache-Control" content="no-cache" />
<meta http-equiv="Expires" content="-1" /> 

Zkoušel jsem ještě zobrazení obrázku upravit takto, aby URL adresa byla pokaždé jiná a abych tím donutil prohlížeč načíst nový obrázek:

echo "<img src=upload/akce.jpg\""."?dummy=".time()."\" width=\"600\" height=\"300\" alt=\"akce\" />";

Z toho se vygeneruje toto:

<img src="upload/akce.jpg?dummy=1392199872" width="600" height="300" alt="akce" />

Ale nepomohlo to. Žádám tedy o radu.

Děkuju.

Předmět Autor Datum
Nemáš tam divně uvozovky? Zkus: echo "<img src=\"upload/akce.jpg"."?dummy=".time()."\" width=\"600\…
hynajs 12.02.2014 11:48
hynajs
S uvozovkama jsem možná udělal chybu teď při přepisu, jméno souboru a rozměry obrázku mám jako promě…
host 12.02.2014 11:59
host
Tohle prej pomohlo. Resi to tam sice v JS, ale melo by se to dat pouzit i na PHP... As an alternati…
MaSo 12.02.2014 12:07
MaSo
Abych pravdu řekl, nevidím v tom nic nového, co bych tam neměl a nezkusil já? Metatagy pro zákaz ca…
host 12.02.2014 12:28
host
Treba ten parametr max-age a # misto ? v tom URL na obrazek...
MaSo 12.02.2014 12:46
MaSo
Podle informací, které jsem našel, tak parametr "no-cache" by měl být ještě striktnější než "max-age…
host 12.02.2014 18:16
host
Já myslím, že by měla fungovat ta konstrukce s tím dummy. Akorát se mi nelíbí ty uvozovky hned za se…
TarasBulba 12.02.2014 14:00
TarasBulba
Uvozovky hned za sebou? Výsledný HTML kód je správný, v tom myslím problém není.
host 12.02.2014 18:18
host
Ještě mě napadá, označit obrázek nějakým id a javascriptem načíst src (přidat přímo v js za src loká…
Flash_Gordon 12.02.2014 18:43
Flash_Gordon
Javascript bych do toho nerad montoval, doufám, že to lze udělat i bez něj? S tím otevřením prohlíž…
host 12.02.2014 20:14
host
Takové chování prohlížeče mě ale poněkud deprimuje Mě deprimuje taky, protože použitý způsob jsem…
hynajs 12.02.2014 20:25
hynajs
Úmyslně jsem nepsal, v jakém prohlížeči jsem to testoval (Firefox), protože i kdyby to v jiném fungo…
host 12.02.2014 20:31
host
Vždy jsi vydán na milost a nemilost autorům prohlížeče. Univerzální řešení všem a všude existuje, je…
hynajs 12.02.2014 20:55
hynajs
Jak psal TarasBulba je podle mě správné chování. Když prohlížeč to bere z cache, tak se řeší tím, že…
ERASER 12.02.2014 20:53
ERASER
Zkus to napsat znova, a tak jak zde bylo řečeno. Nevím, co tím máš na mysli. Po spuštění prohlížeč…
host 12.02.2014 21:00
host
Nevím, co tím máš na mysli. Tím myslím naspat znova ten kód, ačkoliv se ti zdá stejný (nic nekopíro…
ERASER 12.02.2014 22:32
ERASER
Takže problémy sú 2: kešuje sa stránka a kešuje sa obrázok. Oba problémy sa dajú vyriešiť správnym n…
los 12.02.2014 23:04
los
Děkuji všem zúčastněným za cenné rady a pomoc. Speciální poděkování losovi. :beer: Použil jsem násl…
host 13.02.2014 18:05
host
DOpourčil bych toto http://www.jakpsatweb.cz/clanky/caching-tutorial-c zech-translation.html
mnua.al 13.02.2014 19:38
mnua.al
Funguje tohle 2023 <?php header("Expires: Sat, 01 Jan 2000 00:00:00 GMT"); header("Last-Modified: "…
Vita Tano 24.05.2023 00:32
Vita Tano
Toto je zbytočný balast, ono funguje aj to z 2014. Ale čítanie pobavilo :)
pozorovateľ 24.05.2023 05:46
pozorovateľ
Není cachovaná i html stránka obsahující ten query string?
jamarom 24.05.2023 13:02
jamarom
Dotaz byl vyřešen v roce 2014... poslední
host 24.05.2023 13:06
host

Tohle prej pomohlo. Resi to tam sice v JS, ale melo by se to dat pouzit i na PHP...

As an alternative to...

newImage.src = "image.jpg?" + new Date().getTime();

...it seems that...

newImage.src = "image.jpg#" + new Date().getTime();

...is sufficient to fool the browser cache without bypassing any upstream caches, assuming you returned the correct Cache-Control headers. Although you can use...

Cache-Control: no-cache, must-revalidate

...you lose the benefits of the If-Modified-Since or If-None-Match headers, so something like...

Cache-Control: max-age=0, must-revalidate

...should prevent the browser from re-downloading the entire image if it hasn't actually changed. Tested and working on IE, Firefox, and Chrome. Annoyingly it fails on Safari unless you use...

Cache-Control: no-store

...although this still may be preferable to filling upstream caches with hundreds of identical images, particularly when they're running on your own server. ;-)

http://stackoverflow.com/questions/1077041/refresh -image-with-a-new-one-at-the-same-url

Ještě mě napadá, označit obrázek nějakým id a javascriptem načíst src (přidat přímo v js za src lokální datum).

Netvrdím, že to pomůže, ale když selhalo všechno předtím, zkusil bych i toto.

//Editace

A ještě mě napadá, jestli otevření prohlížeče není "cache only" akce.
Protože já když otevřu prohlížeč, tak stránky naběhnou na úplně stejném místě a žádné skripty se neaktivují, takže nemají smysl.

Javascript bych do toho nerad montoval, doufám, že to lze udělat i bez něj?

S tím otevřením prohlížeče na tom možná něco bude. Protože když si zobrazím zdroják, tak podle toho timestampu vidím, že se otevřela vlastně nakešovaná stránka. Teprve po refreshi se změní timestamp a zobrazí správný obrázek. Takové chování prohlížeče mě ale poněkud deprimuje. :-/

Vždy jsi vydán na milost a nemilost autorům prohlížeče.
Univerzální řešení všem a všude existuje, jen pokud záležitost vyřešíš na straně serveru (jménem souboru, kdy PHP vybere soubor s nejnovějším datem - určitě znáš další a asi je nemůžeš v tomto konkrétním případě použít).

Další přirozená otázka nad rámec tohoto tématu: platí stejná nejistota i v případě souborů .js a .css ?
Často to používám při ladění.

Jak psal TarasBulba je podle mě správné chování. Když prohlížeč to bere z cache, tak se řeší tím, že se mu vždy podstrčí jiná URL, aby nemohl nic načítat z cache, protože na dané URL ještě nebyl. To že URL je stejná a mění se pouze parametr za "?" nebo "&" už není podstatné. Zkus to napsat znova, a tak jak zde bylo řečeno.

zavřu prohlížeč, otevřu prohlížeč a znovu stránku zobrazím

Po spuštění prohlížeče napíšeš URL, nebo prohlížeč si zobrazí z paměti naposled prohlíženou stránku?

Zkus to napsat znova, a tak jak zde bylo řečeno.

Nevím, co tím máš na mysli.

Po spuštění prohlížeče napíšu do adresního řádku URL. Samozřejmě se mi během psaní zobrazí celá adresa, protože si ji prohlížeč pamatuje. Ale i když pro jistotu kliknu na šipku "přejít", aby neotevřel nejakou starou verzi z cache ale přešel na aktuální verzi ze serveru, tak se to chová tak, jak jsem psal => zobrazí stránku z cache.

Nevím, co tím máš na mysli.

Tím myslím naspat znova ten kód, ačkoliv se ti zdá stejný (nic nekopírovat, ale napsat to znova od začátku).
Pro ukázku zde mám taky jeden kód (nedívej se na to, že stránka je celá blbě), jde o řádky 30 a 31, které jsou identické, když se na ně podíváš, ale na webu se ukazuje pouze jedna ikonka:
pokus.php

Takže problémy sú 2: kešuje sa stránka a kešuje sa obrázok. Oba problémy sa dajú vyriešiť správnym nastavením HTTP hlavičiek. HTTP hlavičky majú prednosť pred ich ekvivalentami v HTML stránke. Navyše, hlavičky pre HTML stránku nijako neovplyvňujú kešovanie samotného obrázka.

Takže si pozri, aké HTTP hlavičky sa posielajú pre danú HTML stránku a uprav ich tak, aby posielali to, čo si dal do HTML (Pragma: no-cache, Cache-Control: no-cache). Z HTML to potom zmaž.

Pre obrázok stačí v podstate ten dummy parameter, ale zasa sa pripravíš o to, aby sa použila cache, keď sa obrázok nezmenil. Takže ak server generuje E-Tagy alebo Last-Modified hlavičky, tak to môžeš nechať aj bez toho parametra.

Děkuji všem zúčastněným za cenné rady a pomoc. Speciální poděkování losovi. :beer:

Použil jsem následující hlavičky:

header("Cache-Control: no-cache, must-revalidate"); // HTTP/1.1
header("Expires: Sat, 26 Jul 1997 05:00:00 GMT"); // datum v minulosti

A zdá se, že to funguje přesně tak, jak jsem požadoval. Stačí přes FTP změnit obrázek, otevřít znovu prohlížeč a vždy se načte aktuální obrázek. Paráda..... Uf. :-)

Funguje tohle 2023

<?php
  header("Expires: Sat, 01 Jan 2000 00:00:00 GMT");
  header("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
  header("Cache-Control: no-store, no-cache, must-revalidate, max-age=0");
  header("Cache-Control: post-check=0, pre-check=0", false);
  header("Pragma: no-cache");
  header("Content-Type: text/html; charset=utf-8");
  Header("Set-Cookie: flavor=choco; SameSite=None; Secure");
?>

Zpět do poradny Odpovědět na původní otázku Nahoru