强制浏览器清除缓存

html HTML

古一Green

2020-03-24

有什么办法可以在页面上放置一些代码,以便当有人访问网站时,它会清除浏览器缓存,以便他们可以查看更改?

使用的语言:ASP.NET,VB.NET,当然还有HTML,CSS和jQuery。

第3691篇《强制浏览器清除缓存》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

12个回答
斯丁 2020.03.24

您要清除缓存,还是只是确保当前(已更改?)页面未缓存?

如果是后者,则应尽可能简单

<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
猿村村 2020.03.24

可以使用一种技巧。该技巧是在脚本标记中的文件名后附加一个参数/字符串,并在文件更改时对其进行更改。

<script src="myfile.js?version=1.0.0"></script>

浏览器将整个字符串解释为文件路径,即使“?”之后是什么。是参数。因此,现在发生的麻烦是,下次更新文件时,只需更改网站上脚本标签中的数字(示例<script src="myfile.js?version=1.0.1"></script>),每个用户浏览器都将看到文​​件已更改并获取新副本。

老丝阿飞 2020.03.24

不知道这是否真的对您有帮助,但是这就是缓存在任何浏览器上都应该起作用的方式。当浏览器请求文件时,除非存在“脱机”模式,否则它应始终向服务器发送请求。服务器将读取一些参数,例如修改日期或etags。

服务器将针对“未修改”返回304错误响应,浏览器将不得不使用其缓存。如果etag在服务器端无法通过验证,或者修改日期低于当前修改日期,则服务器应返回带有新修改日期或etag或两者兼有的新内容。

如果没有缓存数据发送到浏览器,我猜这种行为是不确定的,浏览器可能会也可能不会缓存不告诉文件如何缓存的文件。如果在响应中设置缓存参数,它将正确缓存文件,然后服务器可以选择返回304错误或新内容。

这是应该做的。在网址中使用随机参数或版本号更像是hack,而不是其他任何东西。

http://www.checkupdown.com/status/E304.html http://en.wikipedia.org/wiki/HTTP_ETag http://www.xpertdeveloper.com/2011/03/last-modified-header-vs- expire-header-vs-etag /

阅读后,我看到还有一个过期日期。如果有问题,则可能是您设置了到期日期。换句话说,当浏览器缓存文件时,由于它具有到期日期,因此不必在该日期之前再次请求它。换句话说,它将永远不会向服务器询问文件,也永远不会收到未修改的304。它将仅使用缓存,直到达到到期日期或清除缓存为止。

因此,这就是我的猜测,您有某种到期日期,应该使用上次修改的etags或所有这些的混合使用,并确保没有到期日期。

如果人们倾向于刷新很多并且文件没有做太多更改,那么设置一个较大的到期日期可能是明智的。

我的2美分!

蛋蛋猿 2020.03.24

除了设置Cache-control:no-cache外,如果您希望每次都刷新本地副本(某些版本的IE似乎需要这样做),还应该将Expires标头设置为-1。

请参阅HTTP缓存-与服务器一起检查,始终发送If-Modified-Since

古一 2020.03.24

将网址更新为以下内容对我有用:

/custom.js?id=1

通过在其后添加一个唯一编号?id=并对其进行递增以进行新更改,用户不必按CTRL + F5刷新缓存。或者,您可以在当前时间后添加哈希或字符串版本,或者在?id=

就像是 ?id=1520606295

老丝阿飞 2020.03.24
<meta http-equiv="pragma" content="no-cache" />

另请参阅https://stackoverflow.com/questions/126772/how-to-force-a-web-browser-not-to-cache-images

宝儿理查德 2020.03.24

我有一种情况,我会在网上为客户拍照,如果更改了照片,则需要更新div。浏览器仍在显示旧照片。因此,我使用了调用随机GET变量的技巧,该变量每次都是唯一的。这是否可以帮助任何人

<img src="/photos/userid_73.jpg?random=<?php echo rand() ?>" ...

编辑正如其他人指出的那样,以下是更有效的解决方案,因为它仅在更改图像时才重新加载图像,并通过文件大小来识别此更改:

<img src="/photos/userid_73.jpg?modified=<? filemtime("/photos/userid_73.jpg")?>"
小胖 2020.03.24

很多答案都没有抓住重点-大多数开发人员都清楚地知道,关闭缓存效率很低。但是,在许多常见情况下,效率不重要并且严重破坏了默认缓存行为。

这些措施包括嵌套的迭代脚本测试(大!)和损坏的第三方软件变通办法。此处给出的解决方案均不足以解决此类常见情况。大多数Web浏览器的缓存都过于激进,无法提供避免这些问题的明智方法。

Stafan阳光 2020.03.24

如果这是关于.css.js变化,一种方法是到“缓存无效”是通过附加像“ _versionNo”为每个版本的文件名。例如:

script_1.0.css // This is the URL for release 1.0
script_1.1.css // This is the URL for release 1.1
script_1.2.css // etc.

或者,在文件名之后执行此操作:

script.css?v=1.0 // This is the URL for release 1.0
script.css?v=1.1 // This is the URL for release 1.1
script.css?v=1.2 // etc.

您可以查看此链接以查看其工作方式。

村村理查德 2020.03.24

对于静态资源,正确的缓存将是使用带有每个部署或文件版本的值的查询参数这将在每次部署后清除缓存。

/Content/css/Site.css?version={FileVersionNumber}

这是ASP.NET MVC示例。

<link href="@Url.Content("~/Content/Css/Reset.css")?version=@this.GetType().Assembly.GetName().Version" rel="stylesheet" type="text/css" />

不要忘记更新程序集版本。

Tom凯 2020.03.24

查看缓存控件到期的 META标签。

<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">
<META HTTP-EQUIV="EXPIRES" CONTENT="Mon, 22 Jul 2002 11:12:01 GMT">

另一种常见的做法是将不断变化的字符串附加到请求文件的末尾。例如:

<script type="text/javascript" src="main.js?v=12392823"></script>

神乐小胖 2020.03.24

不是这样的。一种方法是在传递内容时发送适当的标头,以强制浏览器重新加载:

确保未在所有浏览器中缓存网页。

如果"cache header"在SO上搜索或类似的内容,您将找到ASP.NET特定的示例。

如果您无法在服务器端控制标头,另一种不太干净但有时仅是唯一的方法是在被调用的资源中添加随机GET参数:

myimage.gif?random=1923849839

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android