Question

I have some Javascript on my website that reloads an image from the server when the image is clicked. My web page also has a 60 second timed refresh using Location.Reload. The only snag is the images that are reloaded via a click do not overwrite the images stored in the cache, so having clicked an image (to get the latest version), the timed refresh then replaces it with the older cached version. I don’t want to reload the entire page from the server every minute as most of the 25 images will not change. How can I force my “manually” reloaded images into the cached version of the page?

Answer 1

The browser thinks, the image is the same, so it doesn’t reload it. You have to trick it to load it from server.

Try setting the URL of an image with a parameter that changes, to trick the browser to load it. I.e.

<img src="$url-of-image?timestamp=$timestamp" alt="changing" />

For example:

<img src="http://www.thing.com/animal.jpg?timestamp=123456" alt="changing" />