为什么即使禁用了缓存，服务器也会忽略代码文件中的更改？

Question

我在我的本地主机（Windows 7，Chrome v79.0.3945.130（64 位））上测试了一个 html/js 代码，大约 50% 的时间代码更改没有反映在浏览器中（我用开发工具/源看到它）。
互联网上有很多建议，但似乎都不起作用：

• 右键单击重新加载并选择“清空缓存和硬重新加载” - 在 30% 的情况下没有帮助。
• 在 Chrome 开发工具的网络选项卡中禁用缓存 - 没有帮助。
• 添加<meta http-equiv="Cache-control" content="no-cache">在标题中 - 没有帮助。
• 替换<script src="common.js"></script>为<script src="common.js?blabla"></script>- 在 60% 的情况下有帮助，但是您需要在每次更改后都执行此操作是一项繁重的工作。此外，它不适用于 html 更改。
• 将文件复制到新文件（如 index.html 到 index2.html）并替换代码中的文件名 - 总是有效，但它是一个更大的苦差事。

当我将代码提交到 github.io 时出现完全相同的问题

请帮我制作它，以便网站立即反映代码更改。

---

编辑：我创建了一个文件 index3.html 并在那里只放了“hello world”。在浏览器中打开文件。改为“hello world2”——浏览器更新了内容。更改为“hello world3” - 即使在多次重新加载和“清空缓存和硬重新加载”之后，浏览器仍然显示“hello world2”。我改为“hello world4”——浏览器仍然显示“hello world2”。4 个小时后，我改为“hello world5”——浏览器仍然显示“hello world2”。我用基本记事本编辑了这个文件。

---

Edit2：人们一直在问我正在使用什么服务器。这看起来是问题的一部分。不幸的是，我不知道，也不知道我到底需要做什么来检查它。以下是我迄今为止发现的所有内容：

• 我有inetpub/wwwroot放置 html 和 js 文件的目录，然后在浏览器中打开 index.html http://localhost/。
• Devs Tools 中的我的网络面板如下所示：image link。
• 服务器设置非常快，不需要安装任何额外的软件。即我没有使用 node.js。
• 有 iisstart.htm，inetpub/wwwroot当我打开http://localhost/iisstart.htm它时说 IIS7。

Answer 1

使用参数是正确的方法！在这里，您可以添加一个版本号，您只能手动更改大的更改，为了调试，您可以将其设置为 Date.time() 因此在您的 < head> 标记中，这会强制覆盖所有缓存版本，因为参数始终是新的一：

< script type="text/javascript"> 
    var script = document.createElement('script'); 
    var version = Date.time();
    script.src = "common.js?v="+version; 
    document.head.appendChild(script) 
< /script>

希望这可以帮助！

Answer 2

在使用 Google Chrome 的特定情况下，请尝试以下操作：打开开发工具 -> 转到“网络”选项卡。选中“禁用缓存”复选框，然后刷新页面。

注意：为了使其每次都能正常工作，开发工具窗口必须始终保持打开状态。

但是，为了将更改传播给用户，而不让他们硬刷新页面等，您必须在每个引用文件的末尾附加经常更改的文件的文件版本（正如您所指出的那样）。例如：

<link rel="stylesheet" type="text/css" href="https://cdn.sstatic.net/Sites/stackoverflow/primary.css?v=20b379f72a37" >

v=20b379f72a37末尾附加的是文件内容的自动生成的文件哈希。