Prevent Web Page Content Being Displayed or Loaded From Browser Back/Forward Cache (Disable bfcache)

Currently, the most effective way to disable bfcache or basically prevent page contents (html, css, javascript, images, etc.) from being served by the back-forward cache is by making use of the Cache-Control HTTP header. Configure your web server to send this in the response headers of your web page (HTML document):

Cache-Control: no-store

No need to send it for all the assets (css, images, scripts, etc.) which’ll prevent them from getting cached normally. Remember the idea is to just avoid the browser bfcache because you don’t like some side-effect that it causes, not avoid caching in general.

Of course there are some other ways to make your page ineligible for bfcache by using unload, beforeunload events with empty event listeners, but each of them will work for selective browsers, not all together. Also this behaviour might change for them in the future.

The HTTP header solution should work cross-browser.

Leave a Reply

Your email address will not be published.