html - 无法清除缓存以刷新网页

Question

这听起来像是一个非常基本的问题，但我觉得我已经尝试了一切。

这是 this post 的后续行动我早些时候做了，在那里我解决了问题，只是为了它再次回来。

总而言之，我正在对 contact page 上的 contact.css 文件进行一些更改。当我注意到更改正在脱机工作但没有出现在网上时，我的网站。我通过上面的帖子将这个问题缩小为缓存问题(其他人可以看到更改，但我不能)。

在上面的示例中，我无法让我的网站显示为 background-color:blue - 最终它起作用了，我想我已经修复了它......所以我去改变颜色恢复正常并繁荣，它停止再次刷新更改。

所以我认为这是某种缓存问题，但在我的一生中，我无法正确清除缓存，以便我可以刷新并查看更改。

以下是我已经尝试过的方法:

• 清除 Chrome、Firefox 和 Opera 上的缓存(多次)
• 在 Chrome、Firefox 和 Opera 上硬刷新
• 通过 Chrome 和 Firefox 上的开发工具禁用缓存(这最初有效，然后在我重新更新网站时停止工作)
• 多次检查 CSS 文件是否正确上传，文件路径是否正确。这已得到确认，因为其他人看到了正确的更改。
• 刷新我的 DNS
• 从我的 ISP DNS 更改为谷歌的 8.8.8.8 + 8.8.4.4

我正在使用 HostGator 来托管我的网站，我现在想知道这是否与他们有关？我现在真的不知道。

这是我在网上看到的:

以下是我应该在我的网站的离线版本上看到的以及我确实看到的:

Answer 1

我注意到你说“我真的很想弄清根本问题”，所以我想我会写一个答案来提供一些选项(如果有人想让我添加其他选项，请随意添加评论)。总的来说，确定根本原因可能比解决整体问题要困难得多，但让我们从我能想到的可能原因开始:

• 多个 CDN 服务器需要一段时间才能更新，因此一些服务器返回旧数据(您的当前 session )，一些服务器返回新数据(隐身)
• 服务器 session 缓存，因此当您在一个 http 上下文 session 中重新加载页面时，您会得到相同的内容(例如，我在产品搜索查询中看到过这一点)

解决这个问题的方法相对简单，称为缓存破坏。基本上，每次更新源代码时，只需在查询字符串、文件名或其他内容中添加一个唯一键即可使 url 唯一。例如，对于您的 css，您可以链接 https://path/to.css?v2.0.1 并不断增加版本号。如果你将 webpack 用于你的构建输出，它们有一个 content hash variable您可以在文件名中用作标记。

至于 CDN 可能会缓存过时的内容...内容哈希解决方案将解决该问题，因为它是一个完全不同的文件名，因此如果 CDN 中没有它，它会从根目录中获取它缓存。我不确定 url 版本查询参数是否会做同样的事情，也许其他人可以对此有所了解。