How to clear browser cache when re-uploading image with same filename, in php?

Question

I have a listing of items, that also contains an image thumbnail. Sometimes I need to change the thumbnail image, but keep the filename the same. Is there a way to force the bro

Answer 1

You can use the modification time of file:

<?

$filename = 'avatar.jpg';
$filemtime = filemtime($filename);

echo "<img src='".$filename."?".$filemtime."'>";

//result: <img src='avatar.jpg?1269538749'>

?>

when the file is modified will clear the client cache

Answer 2

I found out that one of the best ways to do this is by having the same URL for getting and posting an image (REST).

POST /my/image (Cache-control: no-cache, must-revalidate)

GET /my/image (Cache-control: must-revalidate)

Answer 3

When sending out the image, make sure not to send any Expires header. Also consider sending this cache header:

Cache-Control: must-revalidate

This will make the browser ask your server for the image every time. Watch for an If-Modified-Since header in the request; if the image is not modified, answer with an 304 HTTP code.

This whole procedure (must-revalidate, If-Modified-Since, 304 answer) will make it possible for the browser to cache the image content but at the same time ask your server if the file has changed.

---

Another, maybe simpler, solution is to only set an Expires header a short time in the future, for example ten minutes, and inform the user of the ten minute delay. This will speed up most page loads since there's no need to do any HTTP request for the image at all.

Answer 4

Append a unique number to the end of the image src

ie

<?php

echo "<img src=../thumbnail.jpg?" . time() . ">";

do this only on the form for the updating avatar

works for me

btw, this works well for forcing updates of other static files

i.e. html for css files is

<link rel="Stylesheet" href="../css/cssfile.css?<?= md5_file('cssfile.css'); ?>" /> 

Answer 5

You can invalidate the cache for an entire page by altering the headers:

<?php
header("Cache-Control: no-cache, must-revalidate"); // HTTP/1.1
header("Expires: Sat, 26 Jul 1997 05:00:00 GMT"); // Date in the past
?>

Answer 6

Please use these rules in your .htaccess file. I used these rules and solved my problem related to image re-uploading with the same file name.

# BEGIN Caching
<ifModule mod_headers.c>
    <filesMatch "\\.(ico|pdf|flv|jpg|jpeg|png|gif|swf|ttf|otf|woff|woff2|eot|svg)$">
        Header set Cache-Control "max-age=0, public"
    </filesMatch>
    <filesMatch "\\.(css)$">
            Header set Cache-Control "max-age=604800, public"
    </filesMatch>
    <filesMatch "\\.(js)$">
        Header set Cache-Control "max-age=216000, private"
    </filesMatch>
    <filesMatch "\\.(xml|txt)$">
        Header set Cache-Control "max-age=216000, public, must-revalidate"
    </filesMatch>
    <filesMatch "\\.(html|htm|php)$">
        Header set Cache-Control "max-age=1, private, must-revalidate"
    </filesMatch>
</ifModule>
# END Caching