如何强制重新加载缓存的 HTML 文件

Posted 2023-02-22

【中文标题】如何强制重新加载缓存的 HTML 文件

【英文标题】：How To Force Reload Cached HTML Files

【发布时间】：2021-04-14 14:58:22

【问题描述】：

我有一个带有 css 和 html 的简单网站，每次我上传新内容都需要几天时间才能刷新。是否有一行代码强制浏览器重新加载我的代码？我有一个每周更改的 pdf 链接。我不知道是强制使用整个代码还是强制使用 pdf 链接。 谢谢

【参考方案1】：

您可以在静态文件中添加参数，例如：

<script src="your-source-here.js?v=34535" />

其他文件也是如此。

对于更高级的解决方案： How to force the browser to reload cached CSS and javascript files

【讨论】：

嘿，谢谢你的反馈，所以把这段代码放在每个 html 文件中（在 内）？

是的，它应该可以解决问题。不要忘记 - 每次上传时将 v= 部分更改为不同的数字

我也倾向于让我的开发工具始终开启“禁用缓存”。这给我带来了一些问题，但总体而言，在开发过程中要容易得多。

【参考方案2】：

使用 CTRL + SHIFT + R 重新加载

chrome 的作用是，当您加载页面时，它会加载外部脚本。第一次加载脚本时，它会缓存它，这样就不必每次都加载它。要清除缓存，请使用 CTRL SHIFT R

看看这个： Clear the cache in JavaScript

【参考方案3】：

请查看以下链接：How do we control web page caching, across all browsers?

有不同的方法可以做到这一点：

如果您想使用htaccess 文件，请在其中添加以下行：

<IfModule mod_headers.c>
  Header set Cache-Control "no-cache, no-store, must-revalidate"
  Header set Pragma "no-cache"
  Header set Expires 0
</IfModule>

如果您只想在 html 主文件中执行此操作，请在 head 标记中添加以下内容：

<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">

希望我的回答对你有帮助。

【讨论】：

唯一的问题是它会影响网站的性能（页面加载时间会更长）