CSS在打开控制台后停止在Chrome中工作

我正在用node.js制作一个应用程序，有几个html页面是用一个css文件设计的。在我点击主页上的一个链接（指向子页面）并在一个新选项卡中打开它之后，一切看起来都很好。但是，在我按下ctrl+F12并打开控制台后，css样式不知何故“停止工作”，这意味着：

即使html中的“元素”选项卡中有带有style.css的链接标记，这些元素也没有样式

在“网络”选项卡中，我只能看到其中列出的状态为304的style.css文件（所有其他js文件都不在那里，即使js脚本可以工作）

当我返回主页时，css样式也不可见（它们在新选项卡打开之前，现在在Netwok中处于304状态）。刷新后，样式将返回（状态为200）

刷新子页面后，一切又恢复正常，打开控制台对样式没有任何影响（网络选项卡显示所有文件，包括状态为200的style.css）。再次关闭/打开控制台后，一切也正常

如果我不刷新子页面，当我更改窗口大小时，样式会“返回”（虽然不是立即，但在一秒钟后）。否则，只有html和工作的js脚本

只有在首次打开控制台后，Chrome（53.0.2785.101版）才会出现这种情况。我不知道为什么会发生这种情况。

---

请帮忙

尝试清除chrome中的缓存，然后重新启动chrome并重试。 （304响应头不一定是错误。它只是意味着浏览器应该从缓存加载资源。基本上，浏览器会说“嘿，我可以使用您上次给我的CSS文件的相同副本吗，或者它是否已更改？”服务器会说“它没有更改，继续使用您拥有的副本”AKA 304）

---

如果这还不能解决问题，您可以研究一下

好的，我设法解决了这个问题。这个问题似乎是Chrome的bug，例如在这里讨论：

我不确定我的解决方案是否完美，但现在它似乎奏效了。我刚刚在我的server.js中的express.static中添加了一个选项（我使用express js）：

我猜max-age属性在这里很重要——它是在缓存控制http头中指定的（单击给定文件后，您可以在网络选项卡的Dev-Tools控制台中看到）。找到了第一个链接中提到的解决方案。如果我看到更多问题，我将更新此答案。 对不起，我不能详细解释这个问题

---

编辑：此解决方案有一个主要缺陷：当我编辑文件时，浏览器仍会加载旧版本。因此，当我希望看到文件中的更改时，我会关闭此“最大年龄”属性。如果有人有更好的解决方案，请分享。

感谢您的回答，不幸的是，清除缓存没有帮助。我不认为304是问题所在；例如，更改窗口大小后，此状态不会更改，但样式会返回。这太奇怪了，我以为这是最新Chrome版本的bug。

app.use(express.static('public', {maxAge: '5d'}));