如果我不清除缓存，为啥我的 Flask 应用程序不呈现 CSS？

Posted 2023-02-21

【中文标题】如果我不清除缓存，为啥我的 Flask 应用程序不呈现 CSS？

【英文标题】：Why does my Flask app not render CSS if I don't clear my cache?如果我不清除缓存，为什么我的 Flask 应用程序不呈现 CSS？

【发布时间】：2020-08-27 15:49:05

【问题描述】：

我一直在使用 Flask 并将我正在渲染的 html 链接到 css 样式表。我注意到每当我更新我的 CSS 代码时，我都必须清除缓存才能让它在网页上更新。我该如何解决这个问题？

【参考方案1】：

我假设您正在加载您的 CSS 文件，例如：

 url_for('static', filename='some/file.css') 

为了在开发中立即刷新，您应该将以下配置变量设置为-1：

app.config['SEND_FILE_MAX_AGE_DEFAULT'] = -1

正如@Matvei 所说，这个问题更多地与您的浏览器有关。要对此进行可视化，请打开开发工具，转到 Network 标签并突出显示特定的 CSS 文件。然后在右侧部分中查找 Headers -> Response Headers 下的以下行：

Cache-Control: public, max-age=-1

如果设置已正确应用，则应显示-1。如果它显示任何其他内容，您需要刷新该特定文件，直到它显示-1，可能必须清除您的缓存。这是因为浏览器会根据Cache-Control 标头来选择是否重新加载文件。

请参阅我的 similar answer 以及屏幕截图和文档链接。

【讨论】：

这行app.config['SEND_FILE_MAX_AGE_DEFAULT'] = -1到底是做什么的？

@Serket 查看我链接的类似答案以获取更多信息。它基本上将Cache-Control 标头设置为在几秒钟内到期。 -1 实质上禁用了缓存。默认值为 12 小时或 43200。此标头告诉您的浏览器何时重新加载单个资产。显然，如果您经常更改 CSS 文件，您希望禁用此功能。因此设置。

【参考方案2】：

tldr：使用 Ctrl-F5 刷新页面（或任何用于硬刷新的键盘快捷键）。 完整答案：

问题（如果你想这样称呼它）是你的浏览器，而不是 Flask。

为了提高速度，浏览器会缓存数据。在您的情况下，您的浏览器正在为您的网页缓存 CSS。您的浏览器不知道您何时更新 CSS，这就是您必须清除缓存的原因。

即使有办法禁用它，我也不会。如果没有缓存，网页浏览会明显变慢。

您可以进行硬刷新，而不是清除整个缓存。这将告诉浏览器直接从服务器重新加载所有数据（包括 CSS）。在 Firefox 中，快捷键是 Ctrl F5。

更多信息在这里：https://humaan.com/blog/clear-your-browser-cache-a-quick-guide/