prevent caching when pressing BACK buttons

Question

When you press the back button in Google Chrome, it seems it caches the source code (as opposed to the DOM in FF, but that is just observation, not some thing I know for sure).

Some times I need to prevent such caching, for example when you are in a checkout process, redirects to paypal etc.

How do I do it?

See this answer. http://stackoverflow.com/a/2068407/1344966 – Lee Lowder Jul 30 '12 at 21:43 — Lee Lowder, Jul 30 '12 at 21:43
Sadly, I am aware of this. Won't solve this, though – Itay Moav -Malimovka Jul 31 '12 at 13:55 — Itay Moav -Malimovka, Jul 31 '12 at 13:55

score 0 · Answer 1 · answered May 27 '15 at 21:04

This is indeed an issue, and seems to be specific to Chrome. In my case I was only concerned about a stale page being displayed if it contained a form, and all my forms are submitted using the same AJAX form library that I wrote, so I added this code to run prior to doing the redirect (the redirect is done in JS using window.location = ...):

//If the user clicks the back button after submitting the form and being redirected,
//Google Chrome redisplays previous entries even if they have since been changed
//(its caching works differently from other browsers).
//This is a (non-foolproof) hack to try to prevent this.
if (window.chrome) {
    //This re-requests the page headers for the current page,
    //which causes Chrome to clear its cache of the page.
    //Unfortunately there appears to be no other client-side way of preventing this caching issue in Chrome.
    $.ajax({
        url: window.location,
        method: 'HEAD'
    })
}

Of course it would be much cleaner to just set no-cache headers on the server-side, but I didn't want to do that for all pages, and I didn't want to bother detecting which pages contain forms (or manually setting the cache headers on those pages) just to prevent this issue in Chrome.

I hope there is a better solution, but I haven't found one yet...

score 0 · Answer 2 · answered Jul 14 '15 at 09:59

<script type = "text/javascript" >
    history.pushState(null, null, '');
    window.addEventListener('popstate', function(event) {
    history.pushState(null, null, '');
    });
    </script>

add this javascript, this should block the back button, you can use this method as an alternative

prevent caching when pressing BACK buttons

2 Answers2