administration mode
Pssst...Ferdy is the creator of JungleDragon, an awesome wildlife community. Visit JungleDragon

 

Prevent AJAX URL caching »

FERDY CHRISTANT - JUN 29, 2006 (02:16:50 PM)

  AJAX development has a number of caveats. This tip discusses how to solve a simple yet important problem. Imagine you have a form with a button on it. When a user clicks the button, an action will be run, yet the page will not be refreshed. This is a very typicaly AJAX scenario.

The remote action that gets called, is triggered by a URL, i.e. the URL of a script. The URL is triggered each time the button is clicked. This is where the problem comes in. Once the response of the first time the URL is triggered is received, IE caches that response. Thus, any subsequent calls to the same URL will not give back realtime data, instead the cached response. AJAX almost always depends on fresh data, so this is a crucial problem.
The solution however, is simple. All we need to do to prevent this form of caching is to make sure that the URL we use in the remote call is unique, or at least different from one in the cache. This is as easy as appending something dynamic to the end of it. The next code fragment appends the milliseconds since 1970 to the end of the URL to realize this: <input type="button" onclick="
var xmlhttp = new XMLHttpRequest();
xmlhttp.open('GET', 'yourscript.php?ms=' + new Date().getTime(), true);

xmlhttp.onreadystatechange = function() {
   if (xmlhttp.readyState == 4) {
      alert('Status is ' + xmlhttp.status);
      if (xmlhttp.status == 200) {
         alert('Status is ' + xmlhttp.status);
      }
}

// send the request xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xmlhttp.send();
;" value="Test">

Note that the code fragment above uses Sarissa for simplified AJAX development. If you like to use the code fragment you should therefore include the Sarissa library, and most likely also change the first part of the remote call URL.

Share |

Comments: 8
Reviews: 5
Average rating: rating
Highest rating: 5
Lowest rating: 1

COMMENT: ANDREI KOUVCHINNIKOV homepage

JUL 4, 11:50:46

comment » I have a similar solution for LotusScript: http://dominounlimited.blogspot.com/2006/05/microsoftxmlhttp-and-cached-data.html

Strangely, caching does not seem to happen when same code is run in VB. «

COMMENT: ANONYMOUS rating

DEC 25, 04:48:52 PM

comment » Great! This solved my problem with IE6 caching my requested files. «

COMMENT: BELLYBUTTON homepage

AUG 15, 2008 - 12:47:08

comment » That is great and it works. I used it to get always a different captcha image. «

COMMENT: DON JONES rating

OCT 7, 2010 - 01:58:28 AM

comment » I'm a web developer. I struggled with this problem for days. But your idea saved my bacon. GREAT JOB, FERDY!!!!!!!! 28 28 28 «

COMMENT: RANZENFRÖHN rating

OCT 25, 2010 - 12:32:52

comment » absolutely useless «

COMMENT: SABASTIAN rating

NOV 15, 2011 - 20:59:36

comment » Great !!!!!!!!!! «

COMMENT: SWAS

APR 16, 2012 - 02:11:21 PM

comment » great solution dude «

COMMENT: JINS homepagerating

DEC 20, 2013 - 04:56:09 AM

comment » Works fine thanks a lot.. «

RATE THIS CONTENT (OPTIONAL)
Was this document useful to you?
 
rating Awesome
rating Good
rating Average
rating Poor
rating Useless
CREATE A NEW COMMENT
required field
required field HTML is not allowed. Hyperlinks will automatically be converted.