I need to reload a page using JavaScript and ensure that it does not pull from the browser cache but instead reloads the page from the server. [As elements of the page will have changed in the interim]
On IE and FF I found that the following code worked fine;
window.location.reload(true);
However it does not work on Chrome or Safari.
I tried the following, but also to no avail;
window.location.replace(location.href);
document.location.reload(true);
document.location.replace(location.href);
Is there a solution to this issue?
Findings
After looking into this I have found that this issue is HTTP Protocol handling;
Pragma: no-cache
HTTP fieldLast-Modified: DATE1
fieldlocation.reload(true)
to force a reload from server not cacheIf-Modified-Since: DATE1
fieldHTTP Status 304 Not Modified
The server application is at fault for not noticing the state change in the dynamic page content, and thus not returning a 200
.
However, Chrome/WebKit is the only browser that sends a If-Modified-Since
field when the JS location.reload(true)
is called.
I thought I would put my findings here in-case someone else comes across the same issue.
You can use this hack:
$.ajax({
url: window.location.href,
headers: {
"Pragma": "no-cache",
"Expires": -1,
"Cache-Control": "no-cache"
}
}).done(function () {
window.location.reload(true);
});