views:

215

answers:

4

I'm have an action /json that returns json from the server.

Unfortunately in IE, the browser likes to cache this json.

How can I make it so that this action doesn't cache?

+1  A: 

This is a common problem -- IE caches all ajax/json requests on the client side. Other browsers do not.

To work around it, generate a random number and append it to your request url as a variable. This fools IE into thinking it's a new request.

Here's an example in javascript, you can do something similar in Python:

function rand() {
    return Math.floor(Math.random()*100000);
}

$("#content").load("/posts/view/1?rand="+rand());
BikingViking
I like this approach too and that's what I'm currently doing, but I prefer to just have the header tell IE not to cache
resopollution
I didn't realize it was possible to set no-cache headers for a json request. That's definitely a better solution if you can make it work.
BikingViking
+1  A: 

Make sure your responses are not telling the browser that the content expires in the future. There are two HTTP headers the control this.

  1. Expires
  2. Cache-Control - There are many possible values for this header, but the one that controls expiration is max-age=foo.

In addition, IE may be revalidating. This means that IE includes some extra information in the request that tell the web server what version of the resource it has in its cache. If the browser's cached version is current, your server can respond with 304 Not Modified and NOT include the content in the responses. "Conditionatl GET requests" include this versioning information. It's possible that your server is giving 304 responses when it shouldn't be.

There are two sets of headers that control revalidation:

  1. Last-Modified + If-Modified-Since
  2. ETag + If-None-Match

Last-Modified, and ETag are response headers that tell the browser what the version of the resource it is about to receive. If you don't want browsers to revalidate, don't set these. If-Modified-Since and If-None-Match are the corresponding request headers that the browser uses to report the version of a stale resource that it needs to revalidate with the server.

There are various tools to see what HTTP headers your server is sending back to the browser. One is the Firefox extension Live HTTP Headers. Another tool, which Steve Sounders recommends is IBM Page Detailer. I haven't tried this one myself, but it doesn't depend on the browser that you're using.

allyourcode
+2  A: 

Make sure your response headers have:

Cache-Control: no-cache
Pragma: no-cache
Expires=-1
drr
A: 

Hi,

The jQuery library has pretty nice ajax functions, and settings to control them. One of them is is called "cache" and it will automatically append a random number to the query that essentially forces the browser to not cache the page. This can be set along with the parameter "dataType", which can be set to "json" to make the ajax request get json data. I've been using this in my code and haven't had a problem with IE.

Hope this helps

writes_on