浏览器上的“后退”按钮使无缓存页面可访问

Back button on browser making no-cached page accessible

本文关键字：缓存 访问 按钮 后退 浏览器      更新时间：2023-09-26

所以我正在HTML文档（类似于Snapchat）中测试这种短暂的图像功能。

我的图像可见 X 秒，之后页面重新加载，显示的图像消失。避开人们可以保存此类图像的无数方式，我目前专注于刷新功能。

我刷新页面的JS代码如下： 

<script>
window.setTimeout(function () {
    window.location = "example.com/page.html?nocache=" + (new Date()).getTime();
}, 5000); // refresh/redirect after 5 seconds.
</script>

我编写了在单次刷新后销毁图像的代码 - 因此上述触发器完美运行。但问题是浏览器上的后退按钮。如果你按下它，你只需再次看到图像。游戏结束！

我已经在我的 HTML 文档中包含了以下元标记，但它们没有帮助：

<meta http-equiv="Cache-Control" content="max-age=0">
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">

有没有办法确保浏览器后退按钮从等式中删除，或者其效果被中和？请指教。

不要刷新页面，而是使用简单的 DOM 操作来删除图像。如果你加载了jQuery，你可以很容易地这样做：

<script>
window.setTimeout(function () {
    $( 'img' ).remove();
}, 5000); // refresh/redirect after 5 seconds.
</script>

（如果页面上有多个图像，则需要使用更具体的选择器）

若要在此上下文中加载新映像，需要使用 AJAX 请求，并设置新的计时器。但这会导致后退按钮无法恢复图像。

相关文章：