进行更改时清除客户端浏览器的缓存

clear cache of clients browsers when making changes

使用 HTML/CSS 开发网站时,在开发阶段防止缓存是有意义的,因为浏览网站的人会看到旧版本。在使用元标记之前,我已经看到了这方面的线程,即:

<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="-1" />enter code here

但是这个剂量似乎可以与 HTML5 一起使用,同样我只想在我进行更新后将客户端缓存清空。

例如,如果我在 index.html 中有一个图像并更新此图像(相同的文件名不同的内容),那么客户将看到以前的图像

有没有一种方法可以对 html 页面进行版本化,以便客户端浏览器缓存版本 1,然后在重新加载时如果我将 html 更改为版本 2,缓存将被清空,新的将加载所有更改的网站?

似乎大多数 Web 开发都需要这样,否则客户将永远看不到更改

您可以在索引页(或您加载文件的任何位置)中编辑 <link> 文件。在 .css 之后,您需要输入一个查询,如 ?v= ...

像这样:

旧文件:<link href="/css/TestFile.css" rel="stylesheet">

修改后刷新缓存:<link href="/css/TestFile.css?v=1" rel="stylesheet">v代表版本,可以使用任意字符。

这会为访问网站的每个人重置缓存,让他们看到新版本而不是旧版本

就我而言,我更改了很多特定的 JS 文件,我需要它在所有使用的浏览器中都是最新版本。

我没有这个文件的特定版本号,所以我简单地散列当前日期和时间(小时和分钟)并将其作为版本号传递:

<script src="/js/panel/app.js?v={{ substr(md5(date("Y-m-d_Hi")),10,18) }}"></script>

我需要每分钟加载一次,但您可以决定何时重新加载。

在你的头部内容中添加以下内容-

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