In my last post, I demonstrated the concepts of progressive enhancement and graceful degradation using AJAX as an example. In my example, I made use of the HTTP POST method in my AJAX request for the current time from the server. However, since I didn’t have any data to post to the server, you might be wondering why I didn’t just decide to make an HTTP GET request instead. The primary answer is a simple one: Internet Explorer caches the results of HTTP GET AJAX requests.
While using HTTP POST for all AJAX calls is one workaround to this problem, it assumes that you have the ability to modify the server code to accept HTTP POST rather than HTTP GET. In my work, whenever I’m developing server-side code, this is generally the approach that I take. However, in cases where you’re making an AJAX call to a third party service, this option is not likely available to you. For these situations, you can avoid IE caching by appending some extra data to the end of the URL that you change each time a call is made (such as a timestamp). The server will ignore these values, and although IE will cache the results, the results are cached by URL, meaning that each request will avoid a cache hit and will cause the URL to be called. If you’re using the JQuery ajax method, you can further simplify this process by instructing AJAX to not cache HTTP GET results (which behind the scenes causes ajax to append a timestamp to the URL as discussed above). You can learn more about this workaround in the JQuery ajax documentation.
So there you have it. Happy cache-free ajax-ing!