由于缓存，网站 html 不会为用户更新

Question

我正在制作一个网站，但我的用户遇到了网站缓存问题。我开发了我的网站并设置了 chrome 开发人员工具来禁用我的网站的缓存以进行开发。问题是当我发布新更改以促使我的所有用户由于浏览器缓存而无法获得更新时。当我在朋友的计算机上手动删除我网站的缓存时，它可以工作，但我显然不能期望每个人都这样做以获得新的更新。无论如何我可以通过版本控制或其他方式解决这个问题？我环顾四周，但似乎找不到任何东西。

编辑：我知道我可以完全阻止缓存，但我不想完全阻止看起来像糟糕设计的缓存

原文由 Tomer Shemesh 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

缓存的资源是什么？我怀疑 js/css 文件，处理这个问题的一个好方法是在这些资源的路径中添加一个带有版本的查询参数，以便在版本更改时强制浏览器加载新文件，如下所示：

 <script type="text/javascript" src="your/js/path/file.js?v=1"></script>
<link href="/css/main.css?v=1" media="screen,print" rel="stylesheet" type="text/css">

并且当您发布网站的新更新时，按如下方式替换版本：

 <script type="text/javascript" src="your/js/path/file.js?v=2"></script>
<link href="/css/main.css?v=2" media="screen,print" rel="stylesheet" type="text/css">

浏览器会认为该文件是一个新文件，并且会更新缓存。希望这可以帮助。

为了禁用 html 缓存，您可以将元标记添加到您的文件，如下所示：

 <META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">

但这将完全禁用具有此元标记的 html 文件的缓存，我认为没有一种方法可以像处理 js/css 文件一样轻松地处理此问题，但您可以设置元标记以在将来刷新 html。如果您需要更多信息，这是一篇描述如何使用该元标记的文章：

http://www.metatags.info/meta_http_equiv_cache_control

原文由 taxicala 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

您可以强制页面在一定时间或其他条件后自动重新加载。

<META HTTP-EQUIV="refresh" CONTENT="15">

或者让它更受事件驱动：

<A HREF="javascript:history.go(0)">Click to refresh the page</A>

您应该能够根据您的特定需要操纵这些解决方案中的任何一个。

原文由 Kirk Powell 发布，翻译遵循 CC BY-SA 3.0 许可协议