Browser shows the same image after the update
If there is an image change on the same file name, say logo.png or front.jpeg, the change won’t happen right away unless you force refresh it on browser to clear the cache.
The problem with this one is when you have dynamic updates and your users couldn’t see the change right away b/c of the cache.
The simple fix for this would be appending version at the end of the file name. Like your original html would look like:
img height="200" src="/path/to/image/file.ext"
Then appending the version at the end
img height="200" src="/path/to/image/file.ext?v=someVersionGoesHere"
For any backend it would be easy to append the versioning when the image is presented. It could be random number or unix timestamp would work in this case too..
var version = new Date()->getTime(); //get the unix timestamp var path = "/path/to/image/file.ext?v="+version; $('#image_id').attr('src', path);
Shall do the trick. I used jQuery her but, it is not limited to it..
Git add not working for folder with .git folder
Mac Numbers document to Excel
Select an element with multiple classes jQuery
Change the name of computer in Mac
Mommy look.. Upgrading jQuery breaks live :(