Search code examples
javascripthtmlimagehtml5-filesystem

Circumvent cached images loaded from HTML5 FileSystem API

I am saving images to the HTML5 filesystem using the FileSystem API. Every n minutes I'm reloading and replacing these images from a server side method.

After each reload/replace cycle I'm showing these images on a website.

var img = new Image();
img.src = 'filesystem://...';

But the image doesn't get updated on the website. When I open the filesystem url in a new tab I can see the changes.

I've added a "random" query parameter to the filesystem url

"&rnd=" + new Date().getTime();

but that doesn't circumvent the browser cache (I'm assuming that the problem is the browser cache, because in the Chrome Developer Tools in the Network tab says "(from cache)")

"from cache" even with a query parameter

Solution

  • I wrote a test case for this question. To my surprise it worked as it should. I guess that the last chrome update fixed this issue for me:

    If someone wants to try this, have a look here:
    http://test.joquery.com/cachedfilesystem/