Chrome 不断加载我网站的旧缓存答案

【问题标题】：Chrome keeps loading a old cache of my websiteChrome 不断加载我网站的旧缓存
【发布时间】：2014-11-24 12:34:52
【问题描述】：

我遇到了这个奇怪的问题，我的 Chrome 浏览器一直在加载我的网站的旧版本，其代码甚至不再存在于我的服务器上。我认为这是一个典型的缓存问题。

我尝试清理浏览器缓存，使用 igcognito 模式，并清理 DNS 缓存。旧的缓存页面仍在加载中。

这个问题好像已经在这个google群里讨论了三年了，但是还是没有解决办法。 https://productforums.google.com/forum/#!topic/chrome/xR-6YAkcASQ

使用 firefox 或任何其他网络浏览器都可以完美运行。

这不仅仅发生在我身上。我的所有同事在我的网站上都遇到了同样的问题。

【问题讨论】：

是的。我希望 Chrome 加载服务器上的内容
我也有同样的问题，就好像你必须等待链上的东西清除它的缓存才能看到新版本。我想知道它是什么。
令人惊讶的是，到了 2020 年这仍然是一个问题。标准解决方案是“清除缓存”。我们中的一些人通过网站经营业务，并且不希望每次我们进行更新时都告诉每个客户去“清除缓存”。太可怕了当您使用像 React 这样的框架时，另一种对每个 js 文件进行版本控制的解决方案（我的脑袋）不起作用。也许在 20 年后，这将最终通过从服务器发送到客户端的“脏”标志来解决，就像 20 年前应该的那样。
是的，2020 年 Angular 应用程序也存在同样的问题！难以置信。
2021 年仍然面临这个问题。尽管索引页面中有所有元标记，Chrome 仍会加载旧页面。 Ctrl-F5 加载最新页面。但是在新标签页上打开页面会回到旧版本。

标签： google-chrome caching

【解决方案1】：

<?php Header("Cache-Control: max-age=3000, must-revalidate"); ?>

您可以实现一个 PHP 脚本，该脚本必须是索引文件中的第一行代码。它是通常由 Web 服务器发出的 http 标头。您还可以重命名被视为“陈旧”的资源。本教程将为您提供更多详细信息。 https://www.mnot.net/cache_docs/

【讨论】：

即使我们后来有很多版本的 Chrome，这个答案仍然解决了我们在开发中遇到的问题。另外，澄清一下，这个标头可以添加到任何 Web 服务器中 - 它不是 PHP 特定的。

【解决方案2】：

我不确定我是否正确理解了您的问题，但我遇到了类似的情况，我没有清除缓存，而是通过执行以下操作禁用了它：打开 chrome，然后转到您的网站按 Command + Option + C（Mac）现在你已经打开了 chrome 的 DevTools，进入主菜单，上面写着：Elements Console Sources ... 单击显示网络的菜单元素确保选中“禁用缓存”复选框然后在不关闭 DevTools 的情况下重新加载页面这对我有用。让我知道它是否对你有用:)

【讨论】：

Windows 上的键盘快捷键是我这也适用于我

【解决方案3】：

查看新版本网站的短期解决方法通常是清除缓存并重新加载，但出于某种原因，这在 Chrome 上并不总是有效。这个短期解决方案不会为您网站上的每个用户解决问题，它只会让您看到您网站的新版本。

向 CSS 和 JS 文件添加版本号将允许您和其他所有用户查看您网站的最新版本。如果版本号与用户缓存中的版本号不同，版本号将强制任何浏览器不从用户的个人计算机缓存中加载，而是加载服务器上的实际文件。

如果你的服务器上有这些文件：

ExJS.js
ExCSS.css

并将它们更改为：

ExJS.js?v=1.01
ExCSS.css?v=1.01

这些文件的新版本将在任何浏览器中加载。

通常，浏览器总是会从服务器加载 HTML 文件，但您可以使用一些 HTML 元标记来确保将为任何用户加载最新的 HTML 版本：

<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />

还有一些方法可以确保其他语言的文件也总是加载最新版本，这在这篇文章中进行了讨论：

How to add version number to HTML file (not only to css and js files)

【讨论】：

chrome://settings/siteData 从各个站点删除数据

【解决方案4】：

您可以按Inspect，然后按网络并选中禁用缓存。

【讨论】：

【解决方案5】：

更改图像的名称并在 html 文件中进行必要的图像名称更改.. 为我的网站找到了这个快速修复

【讨论】：

【解决方案6】：

我遇到了同样的问题，我还尝试在我的 JSP 页面上禁用缓存

<% response.setHeader("Cache-Control","no-cache");
   response.setHeader("Pragma","no-cache");
   response.setDateHeader ("Expires", 0); %>

但这并没有帮助。

这是 google chrome 和 chromium 浏览器的一个已知问题，即使您清除了缓存和 cookie。

但是，对于大多数用户来说，这可能会发生也可能不会发生。

这也一直没有解决，直到过去 9-10 年的日期。

因此，出于测试目的，我强烈建议使用 Mozilla Firefox 或 Opera。

但听起来您的应用程序仅限于某些浏览器以获得最佳体验，并且听起来可能无法说服企业/最终用户。

话虽如此，这个缓存问题可能会也可能不会发生在我们大多数人身上。

【讨论】：

【解决方案7】：

您应该能够通过重置 Chrome 来解决问题。这是我发现清除这种情况的唯一方法 - 在把头发扯掉半天之后。

在找到这个之前，我尝试清除缓存，删除各种缓存目录的内容等，但徒劳无功。

[截至今天 2021 年 5 月 3 日] 您可以通过点击“设置 > 高级 > 重置和清理 > 将设置恢复为其原始默认值”来执行此操作。请注意，这不会删除任何书签，但会使您退出您登录的所有帐户。

【讨论】：

【解决方案8】：

如果您总是在没有 www 的情况下运行站点，添加 CNAME 也会有所帮助，尝试使用 www.example.com 会起作用。

【讨论】：

【解决方案9】：

我在本地开发时遇到了这个问题，并尝试了以下方法：

清除缓存 + 通常是 Chrome 中的所有文件
像 Eli Duhon 提到的那样设置 Cache-Control 标头。
以多种其他方式设置缓存控制标头。

为我解决问题的唯一方法是重新启动运行应用程序的 docker 容器。

所以我这样做了：

docker-compose down

然后

docker-compose up

之后一切都更新了。

但是，如果您再次有更改，它们仍然没有更新...

所以这当然不是解决这个问题的方法，因为我什至不知道是什么导致了这种行为，但我认为它必须通过热重载和/或 Docker 做一些事情，但这是唯一的事情为我做了诀窍，所以我想我会在这里提到它......

【讨论】：

【解决方案10】：

你有两个选择

a) 考虑对陈旧的资源进行指纹识别，例如

 <script src="js/app-4829382839238882882bb3442bbbbdhh3kh3.js" type="text/javascript"></script>

b) 在您的网络服务器上添加缓存控制标头，例如 Cache-Control、Expires。

这是browser caching的好读物

【讨论】：

请进一步解释您的答案。而且您提供的链接已过时。