禁用 Chrome 缓存进行网站开发

我正在修改网站的外观（修改 CSS），但是由于烦人的持久性缓存，在 Chrome 上看不到结果。我尝试了Shift + 刷新，但是没有用。

如何临时禁用缓存或以可以看到更改的某种方式刷新页面？

答案

Chrome DevTools 可以禁用缓存。

  1. 右键单击并选择Inspect Element以打开 DevTools。或使用以下键盘快捷键之一 ：
    • F12
    • Mac 上的Command + Option + i
    • Windows 或 Linux 上的Control + Shift + i
  2. 点击 Network工具栏中打开网络窗格。
  3. 选中顶部的Disable cache复选框。

开发工具面板的屏幕截图

请记住，正如@ChromiumDev 的一条推文所述，此设置仅在 devtools 打开时才有效 。

请注意，这将导致重新加载所有资源。如果只希望对某些资源禁用缓存，则可以修改服务器与文件一起发送的 HTTP 标头 。

如果您不想使用 “ Disable cache复选框，则在打开 DevTools的情况下长按刷新按钮将显示一个菜单，其中包含 “ Hard Reload或 “ Empty Cache and Hard Reload ，应该会产生类似的效果。了解选项之间的区别 。可以使用以下快捷方式：

  • 在 Mac 上为Command + Option + R
  • Windows 或 Linux 上的Control + Shift + R

长按

在此处输入图片说明

当您需要每小时清除 30 次缓存时，清除缓存太烦人了。. 因此，我安装了一个称为Classic Cache Killer的 Chrome 扩展程序，该扩展程序可在每次页面加载时清除缓存。

Chrome 商店链接（免费） （现在没有恶意软件！）

现在，我的模拟 json，javascript，css，html 和数据每次在每次页面加载 时 都会刷新。

我永远不必担心是否需要清除缓存。

我发现有大约 20 种适用于 Chrome 的缓存清理器，但是这种清理器看起来很轻巧，而且几乎不费力。在更新中，Cache Killer 现在可以保持 “始终打开” 状态。

注意：我完全不了解插件作者。我只是觉得有用。

重新加载菜单的图片

  1. 按F12 ，然后（在控制台打开的情况下）拉起 Chrome 开发者控制台：

  2. 右键单击（或按住鼠标左键）在浏览器顶部的重新加载按钮上，然后选择 “空缓存和硬重新加载”。

这将超出 “硬重载” 以完全清空缓存，从而确保通过 javascript 等下载的任何内容也将避免使用缓存。您不必弄乱设置或其他任何东西，这是一种快速的一键式解决方案。

永久禁用 Chrome 中还有两个选项可以禁用页面缓存 ：

1. 在注册表中停用 Chrome 缓存

打开注册表（开始 -> 命令 -> Regedit）

搜索： HKEY_CLASSES_ROOT\ChromeHTML\shell\open\command

将... chrom.exe 之后的部分更改为以下值： –disable-application-cache –media-cache-size=1 –disk-cache-size=1 — "%1"

示例： "C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" -disable-application-cache –media-cache-size=1 –disk-cache-size=1 — "%1"

重要：

  • ... chrome.exe 之后有一个空格和一个连字符”

  • 保留 chrome.exe 的路径

  • 如果复制该行，请确保检查引号是否为实际引号。

2. 通过更改快捷方式属性来停用 Chrome 缓存

右键单击 Chrome 图标，然后在上下文菜单中选择 “属性”。在路径中添加以下值： –disk-cache-size=1

示例： "C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" –disk-cache-size=1

重要：

  • ... chrome.exe 之后有一个空格和一个连字符”

  • 保留 chrome.exe 的路径

如果您不想编辑 Chrome 的设置，则可以使用隐身模式获得相同的结果。

除了禁用缓存选项（可通过开发人员工具窗口右下角的按钮 - 工具 | 开发人员工具，或Ctrl + Shift + I进入）之外，在开发人员工具的网络窗格中，您还可以现在，右键单击并从弹出菜单中选择 “清除缓存”。

  1. F12打开 Chrome DevTools
  2. F1打开 DevTools 设置
  3. 选中禁用缓存（打开 DevTools 时） ，如下所示：

当前位于 “ 首选项” 选项卡上，这是默认选项。您可能需要向下滚动。自问这个问题以来，此复选框已移动了至少两次。最后我检查了一下，它在底部的中间列中。如果您在较薄的屏幕上打开它，并且 “首选项” 下有两列，则该列可能位于右上角附近。如有任何更改或评论，请随时更新。我将更新该帖子。

在此处输入图片说明

而不是按 “F5”：

“Ctrl + F5”

在 Canary 频道中（也许会紧随开发者和稳定频道），这是 “常规” 部分下左侧的第二个总体选择。

禁用Chrome Canary Channel中的缓存

除此之外，始终可以通过 Ctrl + Shift + N 切换到隐身模式。尽管很遗憾，这也结束了您的会话。

使用Ctrl + Shift + R刷新很不错，但没有得到我需要的一切。仍然有些事情不会刷新，例如存储在 js 和 CSS 中的数据。找到了解决方案： 适用于 Chrome Web 开发人员的 google 工具栏 。安装工具栏后，选择选项和 “重置页面”。