按BACK按钮时阻止缓存

时间:2012-07-27 18:03:19

标签: http caching web-applications web browser-history

当您按下谷歌浏览器中的后退按钮时,似乎它会缓存源代码(而不是FF中的DOM,但这只是观察,而不是我肯定知道的一些事情)。

有时我需要阻止此类缓存,例如当您在结帐过程中,重定向到PayPal等。

我该怎么做?

2 个答案:

答案 0 :(得分:0)

这确实是一个问题,而且似乎是针对Chrome的。在我的情况下,我只关心如果它包含一个表单而显示的旧页面,并且我的所有表单都是使用我编写的相同AJAX表单库提交的,所以我在执行重定向之前添加了此代码以运行(重定向)是使用window.location = ...)在JS中完成的:

//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'
    })
}

当然,在服务器端设置无缓存标头会更清晰,但我不想为所有页面做这些,而且我没有&#39 ; t想要检测哪些页面包含表单(或在这些页面上手动设置缓存标题),以防止在Chrome中出现此问题。

我希望有一个更好的解决方案,但我还没找到一个......

答案 1 :(得分:0)

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

添加此javascript,这应该阻止后退按钮,您可以使用此方法作为替代