我最近制作了一个网站,并对 .js 文件进行了更改,但是当我从 FTP 服务器删除 .js 文件并上传新文件时,新文件没有显示在网站上。我检查了网站上 .js 文件背后的源代码,它是不正确的,它显示的是旧文件的源代码,而不是新文件的源代码,即使旧文件已经消失了。是因为我的浏览器缓存了 .js 文件吗?
注意:我有这个来源
<meta http-equiv="cache-control" content="no-cache" />
在我的页面上阻止浏览器缓存我的页面,我知道这适用于 HTML,但是有了该源,资源文件仍然会被缓存吗?
我的其他页面上没有该行代码,只有我的主页,但其他页面上仍然引用了 .js 文件,所以也许这就是它被缓存的方式?
此外,有没有办法检查浏览器缓存?我用的是铬。
编辑:我刚刚清除了浏览器缓存并重新加载了网站,文件现在可以正常工作,这意味着文件确实被缓存了。所以现在我的问题是如何防止资源文件被缓存?
我不确定无缓存
meta
标签是正确的选择。它否定了所有缓存,并且破坏了快速访问页面的目的。
另外,据我所知,
meta
标签适用于每个页面,所以如果你有一个没有它的页面引用你的JS - 它将被缓存。
防止 JS 文件(以及 CSS)被缓存的广泛接受的方法是区分对它们的请求:
说,你有:
<script type=”text/JavaScript" src="somescript.js"></script>
这个将缓存它(除非存在上述元标记。
您想要的是在每个页面加载时上面的行看起来不同(URL 方面),如下所示:
<script type="text/JavaScript" src="somescript.js?some-randomly-generated-string"></script>
CSS 也是如此。
如果你使用某种 JS 网络 - 如果你给它某种“无缓存”配置选项,它会为你处理这个问题。
当然,你也可以用纯 JS 来完成。某种
Date
相关字符串是一个选项。
现在,通常情况下,您不想取消所有缓存,因此这样做的方法是在 URL 中添加版本参数:
<script type="text/JavaScript" src="somescript.js?version=1.0.0"></script>
并从那里管理您的脚本。
编辑
无需任何额外的扩展。除非我大错特错,否则“Chrome 开发者工具”内置于所有 Chrome 版本中(当然是测试版和开发版),并且可以通过按 Ctrl-Shift-I 来访问。在“网络”选项卡中,您可以看到所有请求、内容和标题。
是的。资源仍然被缓存。在我看来,避免这种情况的一个好做法是以 url?parameter=value 的方式对资源文件进行版本控制。
例如,您应该将 ulr 设置为您的 js 或 css 文件,如下所示:
< ... src="script.js?v=1" .../> < ... href="style.css?v=1 .. />
当发生任何变化时,只需将 v=1 更改为 v=2 ...
这不会影响您的代码,但会让您的浏览器/代理等重新下载资源
使用chrome的隐身实例(ctrl+shift+n)检查源,此模式不会使用任何缓存文件。这样您就可以检查您的文件是否正在客户端缓存。
如果是在客户端,请确保您的服务器没有随 JS 文件一起发送缓存控制标头。
如果它在服务器上,那么就有很多可能性,也许你有反向代理、物理负载平衡器或某种其他类型的缓存机制。
编辑(问题已更改):
使用 此 chrome 扩展 检查随 .js 文件一起发送的标头。可能有一个缓存控制标头集指示 chrome 缓存资源。
如果您使用的是 apache,您可以使用 .htaccess 文件覆盖此行为。