Question

我想从缓存中显示很长时间，我希望页面渲染与从缓存加载页面略有不同。有没有一种简单的方法可以用JavaScript确定这个？

Answer 1

我开始回答“Daniel”上面给出的答案，但我担心，由于连接速度慢，我可能遇到一些延迟问题。

这是最终对我有用的解决方案。在服务器端，我添加了一个cookie refCount并将其值设置为0.在java脚本中的文档加载时，我首先检查refCount然后递增它。检查refCount是否大于1时，我知道页面已缓存。因此，这就像一个魅力。

感谢大家带领我找到这个解决方案。

Answer 2

你可以做的一种方法是在页面中包含页面生成的时间，然后使用一些javascript来比较本地时间和页面生成的时间。如果时间与阈值不同，则页面来自缓存。问题是如果客户端计算机的时间设置不正确，尽管您可以通过使客户端在请求中包含其当前系统时间来生成页面然后将该值发送回客户端来解决此问题。

Answer 3

虽然这个问题已经有4年了。我以为我会使用jQuery和History插件添加2美分。

$(document).ready(function()
{
    $('body').append('<div class="is_cached"></div>');
});

History.Adapter.bind(window,'statechange',function(){
   if($('.is_cached').length >= 1)
   {
      alert('this page is cached');
   }
});

首次加载文档时。附加一个新的div.is_cached。加载缓存页面时，没有兼容的方法来执行javascript，但您可以监视历史记录更改。当历史记录发生更改且div.is_cached存在时，则用户正在查看缓存的分页。

Answer 4

有了新的Resource Timing Level 2规范，您可以使用transfer size属性来检查是否从缓存中加载了页面：

var isCached = performance.getEntriesByType("navigation")[0].transferSize === 0;

规范：https://www.w3.org/TR/resource-timing-2/#dom-performanceresourcetiming-transfersize
浏览器支持：https://developer.mozilla.org/en-US/docs/Web/API/PerformanceNavigationTiming#Browser_compatibility
- 请注意，在撰写本文时，它表明Safari不支持，而实际上最新版本支持。

Answer 5

使用XmlHttpRequest，您可以提取当前页面，然后检查响应的http标头。

最好的情况是只做一个HEAD请求，然后检查标题。

有关执行此操作的一些示例，请查看http://www.jibbering.com/2002/4/httprequest.html

Answer 6

不直接，某些浏览器可能会有一些自定义命令。

有一种解决方法可以满足您的需求。使用cookie存储第一次访问的timestamp，然后使用META HTTP-EQUIV设置文件缓存的时间长度（cacheLength）。如果当前时间在timestamp到timestamp+cacheLength的时间段内，则将其视为从缓存中加载。缓存过期后重置cookie时间。

Answer 7

创建时将唯一数据添加到服务器上的页面。例如随机数或创建时间：

       window.rand = {{ rand() }}

使用本地存储来保存网址和数字，并在以后进行比较（如果需要）：

       reloadIfCached() {
            var cached = localStorage.getItem(window.location.href) == window.rand;
            if (cached) {
                window.location.reload();
            }
            localStorage.setItem(window.location.href, window.rand);
       }

如何使用JavaScript来检测我是否在缓存页面上

7 个答案: