CODEWITHSUNDEEP
javascripthtmlreload
Jack
Jack

Reputation: 1999

Force Hard Reload

I am currently attempting to create a simple test to test the speed of the client's PC by rendering an image. The issue is on browsers such as Safari and Chrome images a saved in some way to allow for a quick reload speed. For example when using the following code

var speed = document.getElementById('speed');
var startTime = new Date().getTime();
var img = new Image();
img.onload = function() {
    var stopTime = new Date().getTime();
    var loadtime = Math.round((stopTime - startTime) / 100);
}
img.src = "testImage.jpg";

The variable loadtime is 8 at first and then 0 after a refresh. My guess is Safari saves the image to load it instantly. On Chrome it's the same issue unless I do a hard reload. I've tried putting these meta tags but with no luck.

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

I've also tried

location.reload(true);

As suggested here but it doesn't seem to do the trick.

Is it possible to force a hard reload without the client's consent or chose? Or is it some sort of security infringement?

Upvotes: 2

Views: 484

Answers (2)

AJcodez
AJcodez

Reputation: 34236

Setting meta tags and reloading the HTML page does not affect the caching of the image. If you want to avoid caching the image try appending a random query parameter each time for example. 

img.src = "testImage.jpg?q=" + Math.random().toString(16).slice(2);

Upvotes: 3

Danny Delott
Danny Delott

Reputation: 7008

You could add a harmless query parameter to the end of the url to break the browser's caching:

img.src="testImage.jpg?noop=<incrementing_number_here>"

Upvotes: 2

Related Questions