I have two pages, A and B. The flow is as follows:

• Go to A
• javascript Ajaxes a bunch of content to add to A, forming A'
• go to B
• pressing [Back] goes back to A, not A', without all the Ajaxed content

Has anyone else noticed this, and if so, how do you fix it?

If Chrome was caching the A' state just before going to B, and reproduces A' upon back, that would be acceptable. If Chrome simply re-loaded the entirety of A (including the Ajax requests that transformed it into A') that would work too. The current behaviour, which is loading an old, incomplete version of A, is not what I want.

EDIT: I know it's loading a cached version because the server isn't receiving any new requests when i hit [Back].

I have two pages, A and B. The flow is as follows:

• Go to A
• javascript Ajaxes a bunch of content to add to A, forming A'
• go to B
• pressing [Back] goes back to A, not A', without all the Ajaxed content

Has anyone else noticed this, and if so, how do you fix it?

If Chrome was caching the A' state just before going to B, and reproduces A' upon back, that would be acceptable. If Chrome simply re-loaded the entirety of A (including the Ajax requests that transformed it into A') that would work too. The current behaviour, which is loading an old, incomplete version of A, is not what I want.

EDIT: I know it's loading a cached version because the server isn't receiving any new requests when i hit [Back].

• javascript
• ajax
• caching
• google-chrome

• What do the cache headers look like for the respective pages? – Quintin Robinson Commented Apr 10, 2012 at 21:25
• @QuintinRobinson: Sorry, what's a cache header? – Li Haoyi Commented Apr 10, 2012 at 21:29
• Your server should be enforcing the caching policy applied to the pages via cache control headers. I sincerely suggest you read up on this matter, here is one resource: mnot.net/cache_docs – Quintin Robinson Commented Apr 10, 2012 at 21:31
• @QuintinRobinson: I'll go study up on them; thanks! – Li Haoyi Commented Apr 10, 2012 at 21:32

3 Answers 3

This topic is old but thought I would share my solution. To get Firefox, Chrome and Safari to behave consistently, you have to set an unload handler on the page that needs to be reloaded when going back, and also use cache busting headers.

Example

In HTTP Headers

Cache-Control: must-revalidate, no-store, no-cache, private

And in the javascript for the page

$(window).unload(function(){}); // Does nothing but break the bfcache

Read here for more info: http://madhatted.com/2013/6/16/you-do-not-understand-browser-history

Well, if you are using xhr request and not hidden frames the back and forward buttons do not tie in to xhr request

I know that topic is old but solution to this problem is not so easy to find I've just wasted few hours to solve it. These two lines solved the Chrome problem for me:

Response.Cache.SetCacheability(HttpCacheability.NoCache);

Response.Cache.SetNoStore();