Question

通常，对于.js和.css文件，我们会在构建过程中附加一个版本 xx.js?v=123，然后在网站部署后，我们可以获得新版本的js和CSS。但是我没有看到有关如何在网站部署发生时进行index.html文件升级的地方。我们确实在IE中看到HTML内容应该已经更改但它仍然使用旧的HTML内容。

我从谷歌找到的一个解决方案是

<meta http-equiv="Cache-control" content="no-cache">

但是，我不确定这是否是最佳解决方案？

Answer 1

是的，这是正确的方法。您必须设置Cache-Control标题，以便让浏览器知道他们不必为该请求缓存任何内容。

<meta http-equiv="Cache-control" content="no-cache, no-store, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">

（Pragma＆amp; Cache-Control是同一个东西，但来自不同的HTTP规范。请参阅此处的答案：Difference between Pragma and Cache-control headers?）

请参阅此处的相关答案之一：How to burst yeoman index.html cache

Answer 2

正如评论中所提到的，它确实是您想要查看的服务器配置，但您没有提到您的设置。我们使用IIS运行带有.NET后端的AngularJS站点。

我们定期更新我们的网站，并且过去曾遇到过JS和CSS资源缓存方面的问题，但我们已通过以下设置解决了这个问题：

<强>构建

我们使用gulp来构建我们的AngularJS应用程序，作为其中的一部分，我们将版本号附加到我们的主应用程序CSS和经常更改的Javascript文件的查询字符串中。例如：

<link href="css/default.min.css?v=2" rel="stylesheet" />

服务器配置

在root web.config中，我们指定我们不希望通过设置cache-control，Pragma和Expires请求标头以及max-age为0。

<location path="index.html">
<system.webServer>
  <staticContent>
    <clientCache cacheControlMode="DisableCache" cacheControlMaxAge="0.00:00:00" />
  </staticContent>
    <httpProtocol>
        <customHeaders>
            <add name="Cache-Control" value="no-cache, no-store, must-revalidate" />
            <add name="Pragma" value="no-cache" />
            <add name="Expires" value="-1" />
        </customHeaders>
    </httpProtocol>  
</system.webServer>
</location>

参考文献：

IIS客户端缓存：https://docs.microsoft.com/en-us/iis/configuration/system.webserver/staticcontent/clientcache
缓存控制HTTP标头：https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Cache-Control
Pragma HTTP标头：https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Pragma
过期HTTP标头：https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Expires

Answer 3

通过将内容值设置为0，浏览器将始终从Web服务器加载页面。

<meta http-equiv="expires" content="0">

Answer 4

您可以从特定站点的高级设置中指定IIS，该设置未启用预加载。但是，您的网站性能会受到影响。还要检查特定网站的应用程序池是否具有集成的管道模式和.NET CLR版本。

Answer 5

不，这肯定是不正确的方法。考虑一个有多个页面的网站（阅读：99.999％的网站）您是否认真地认为开发人员应该在每个页面上明确设置无缓存？这与Angular无关，而且与您的Web服务器（它不知道index.html文件中的内容）之间的关系不正确地将文件错误地缓存，就好像它们是静态内容一样。

在修复服务器配置之前，请务必将no-cache视为临时措施。

当AngularJS网站中的网站内容发生变化时，如何使index.html不缓存？

5 个答案: