当前位置：文江博客话题详情

如何使 Web 浏览器缓存内容失效

发布于 2025-01-02 04:46:55 字数 183 浏览 1 评论 0原文

我一直在深入研究 Google Page Speed，优化了我正在开发的许多网站，以便在这方面取得良好的成绩 - 我很自豪地说，非常成功。

我遇到的唯一缺点是，通过完成一些缓存工作，对 JS 和 CSS 的微小更改往往不会导致下载文件的新副本。

当 JS、CSS（或其他资源）发生更改时，有什么方法可以强制下载新副本吗？

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

可爱暴击 2025-01-09 04:46:55

有时我会遇到类似的问题，JS 和 CSS 缓存时间过长。对我有用的解决方案是将上次更新的版本号或时间戳添加到文件名作为查询字符串。这样浏览器就会看到文件发生了变化，并且会再次下载它。

获取 JS 可能是这样的：

http://yourdomain.com/content/js/functions.js?v=201232

I'm running into similar issues sometimes that JS and CSS is cached to long. The solution that works for me is, adding an versionnumber or timestamp of the last update to the filename as querystring. This way the browser sees the file as changed and it will download it again.

Could be something like this for getting JS:

http://yourdomain.com/content/js/functions.js?v=201232

回复收藏 0 原文

晨与橙与城 2025-01-09 04:46:55

我知道这可能是显而易见的，因为您可以了解到用于使缓存无效的“版本控制”技术适用于请求的任何静态资源，但如果不是，我将在此处进行管道传输。

我们允许对我们的某些应用程序进行品牌化，这意味着图像文件以及前面提到的其他静态文件在客户使用我们的过程中经常会发生变化。如果文件使用相同的名称，缓存就会出现问题。方便地，对图像源进行版本控制的想法也同样有效。

<img src="images/title.gif?v=2" />

另外，提及这一点可能并不重要，但是，在这方面，术语“使缓存无效”在技术上并不正确。使缓存无效就是删除缓存条目。没有实际的方法可以真正以编程方式为浏览器执行此操作。我们实际上在这里讨论的是由于文件名发生变化而向网络服务器请求新文件，而不是强制删除原始文件。您可以通过在未使用的版本和较旧的使用版本之间来回更改文件版本并分别查看 HTTP 200 和 304 响应来轻松测试这一点。

I know that this is probably apparent, as, you could gather that the "versioning" technique for invalidating cache works for any static resource requested, but in case it is not, I will pipe in here.

We allow branding for some of our applications, and, that means image files very often change during the course of clients' lifetimes with us, as well as other static files previously mentioned. If the same name were to be used for a file, caching would present a problem. Handily, the idea of versioning the source of an image works just as well.

<img src="images/title.gif?v=2" />

Also, it is probably not important to mention this, but, the term "invalidating cache" in this regard, is not technically correct. To invalidate cache is to remove the cache entries. There is no actual way to truly programatically do this for a browser. What we are actually talking about here is asking the web-server for a new file due the name of the file changing, not forceably removing the original file. You can easily test this by changing a file version back and forth between an unused version, and an older used version, and seeing the HTTP 200 and 304 responses respectively.

回复收藏 0 原文

贪恋 2025-01-09 04:46:55

查看 HTML5 样板。 http://html5boilerplate.com/ 它会自动完成很多您担心的事情，并且它确实会处理缓存每次修改时使用不同名称的 css 文件来使其失效。

捆绑的 .htaccess 中的相关片段：

# ----------------------------------------------------------------------
# | Filename-based cache busting                                       |
# ----------------------------------------------------------------------

# If you're not using a build process to manage your filename version
# revving, you might want to consider enabling the following directives
# to route all requests such as `/style.12345.css` to `/style.css`.
#
# To understand why this is important and even a better solution than
# using something like `*.css?v231`, please see:
# https://www.stevesouders.com/blog/2008/08/23/revving-filenames-dont-use-querystring/

# <IfModule mod_rewrite.c>
#     RewriteEngine On
#     RewriteCond %{REQUEST_FILENAME} !-f
#     RewriteRule ^(.+)\.(\w+)\.(bmp|css|cur|gif|ico|jpe?g|m?js|png|svgz?|webp|webmanifest)$ $1.$3 [L]
# </IfModule>

Take a look at the HTML5 Boilerplate. http://html5boilerplate.com/ It does a lot of the stuff you are worrying about automatically and it does handle cache invalidation by using differently named css files every time they are modified.

Relevant snippet from the bundled .htaccess:

# ----------------------------------------------------------------------
# | Filename-based cache busting                                       |
# ----------------------------------------------------------------------

# If you're not using a build process to manage your filename version
# revving, you might want to consider enabling the following directives
# to route all requests such as `/style.12345.css` to `/style.css`.
#
# To understand why this is important and even a better solution than
# using something like `*.css?v231`, please see:
# https://www.stevesouders.com/blog/2008/08/23/revving-filenames-dont-use-querystring/

# <IfModule mod_rewrite.c>
#     RewriteEngine On
#     RewriteCond %{REQUEST_FILENAME} !-f
#     RewriteRule ^(.+)\.(\w+)\.(bmp|css|cur|gif|ico|jpe?g|m?js|png|svgz?|webp|webmanifest)$ $1.$3 [L]
# </IfModule>

回复收藏 0 原文

~没有更多了~