Question

是否有可能确定加载的网络资源，如css，jscript，图像，甚至html本身都是来自缓存还是没有使用javascript？

我正在尝试在我在开发模式下访问的每个页面上直接创建一个关于这些加载资源的简单报告，以避免每次都打开我的Google Chrome调试工具。

Answer 1

虽然没有直接的方法可以使用javascript来解决这个问题，但我们可以使用windows.performance javascript API来使用脏的解决方法。下面给出的例子

var fileToLookup = "http://sample.com/img/loader.png";
var isCached = Boolean(_.filter(window.performance.getEntries(),function(a){ return a.duration > 0 && a.name == fileToLookup }).length)

这里我们迭代页面引用的资源并按持续时间过滤。如果资源采取＆gt; 0ms，我们假设没有缓存。再次，这不是万无一失的方法。

Answer 2

有许多解决方案可以阻止浏览器缓存资源，例如：

文件名中的版本号（程序员的简单方式，而不是系统管理员）
修改Apache ETags

您可以在文件名后添加资源版本号。每次修改媒体文件（Images / JS / CSS）时，都会更新资源版本。

<?php $resourceVer = '201404151859'; ?>
<script src='scripts/main.js?v=<?=$resourceVer?>'></script>
<link rel='stylesheet' href='style/main.css?v=<?=$resourceVer?>' />

目标：？v = 201404151859 是假的浏览器有不同的main.js文件，main.js？v = 201404151859

如何检查资源是否从客户端缓存加载？

2 个答案: