Skip to Navigation

NoCache for JavaScript and Flash

I just spent a very frustrating day wrangling with cached images. Both JavaScript and Flash have trouble updating dymanic images, when these are cached by the browser. This can be a problem if, for example, your website has sets of images, such as catalogues, that could be updated at any time. Or if the website needs to constantly reload a single image with the same filename, such as a self-updating webcam image.

In my case, it was both. After delving into numerous Internet sources, with some trial and even more error, I finally distilled a solution that, with slight adjustments, works for both JavaScript and Flash.

The basic principle is to trick the browser into thinking that a different image, with a different name, is being loaded. This can be achieved by appending a constantly changing variable into the url of the loaded image:

myImage.jpg?nocache=" + new Date().getTime();

The getTime() method of the Date object returns the number of milliseconds since January 1, 1970 to this date, (or another date specified in the instance). This is perfect for us, because this means that you get a unique number, each time – unless you can refresh faster than a speeding millisecond…

You could also play with the Date object’s methods and exchange getTime() for getHours() or getDate(). This would refresh the images every hour or every day, keeping them in the cache for the current session, which could be useful in some instances.

In JavaScript all you need now is to assign this to the src property of an image, for example:

var cam1 = document.getElementById("cam1");
cam1.src = "../images/cam1.jpg?nocache="
+new Date().getTime();

If you trace out the resulting src or nameProp of the image (I tend to use alerts for this), the returned string will include the url encoding – but will display the correct image, fresh from the HTTP oven.

In Flash you’d use essentially the same syntax, but it’s slightly more complicated. If you attempt to load an image with this url from the IDE, it won’t find the image and will return an error instead. However, it will work fine when embedded in a browser.

To make it work in both, you need to test for the playerType first, before adding the url encoded variable:

var loader:MovieClipLoader;
var viewLoader:MovieClip;
var url:String = "images/catalogue/collection/cat1.jpg";
if (System.capabilities.playerType == "PlugIn"
|| System.capabilities.playerType == "ActiveX"){
      url+="?nocache="+new Date().getTime();
loader.loadClip (url, viewLoader);



This solution is not only limited to images – it can also be used when loading other file types that you wouldn’t like cached, such as XML, SWFs and other files or assets.

15 responses to “NoCache for JavaScript and Flash

  1. Pingback: butterfly71055
  2. Hello! Help solve the problem.
    Very often try to enter the site, but says that the password is not correct.
    Regrettably use of remembering. Give like to be?
    Thank you!

  3. Great post. Thank you. I had to implement this fix in Flex 2 and need to make a few minor changes. In case others out there are looking for a Flex solution:

    import flash.system.Capabilities

    url = ‘file.xml’;

    if (Capabilities.playerType == “PlugIn” || // non IE browsers
    Capabilities.playerType == “ActiveX”) { // IE browser
    url += “?nocache=”+new Date().getTime();

  4. Has anyone noticed this method does not play nice with AS3? Been doing this for a while in AS2 but appending the qparam to the url is bombing my movie. I dont even get a proper XML failure.

  5. Use mod_rewrite on apache server.
    With this lines in a .htaccess :

    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule ^(.+)\.(\d+)\.(js|css|png|jpg|gif)$ $1.$3 [L]

    With that, all access file to a js|css|png|jpg|gif file with this template :
    the mod_rewrite will “redirect” to afilename.js

  6. ho, not all browser support a cache with request argument (after the “?”).

    So, for some browser:
    it’s same that

Leave a Reply

Your email address will not be published. Required fields are marked *