.htaccess 中的旧 ExpiresByType 导致页面布局制动 - 如何强制浏览器缓存重新加载？

Question

我创建了一个新网页，在旧网页中，我在

.htaccess

中具有以下参数：

<IfModule mod_expires.c>
  ExpiresActive On

 # Images
  ExpiresByType image/jpeg "access plus 1 year"
  ExpiresByType image/gif "access plus 1 year"
  ExpiresByType image/png "access plus 1 year"
  ExpiresByType image/webp "access plus 1 year"
  ExpiresByType image/svg+xml "access plus 1 year"
  ExpiresByType image/x-icon "access plus 1 year"

  # Video
  ExpiresByType video/webm "access plus 1 year"
  ExpiresByType video/mp4 "access plus 1 year"
  ExpiresByType video/mpeg "access plus 1 year"

  # Fonts
  ExpiresByType font/ttf "access plus 1 year"
  ExpiresByType font/otf "access plus 1 year"
  ExpiresByType font/woff "access plus 1 year"
  ExpiresByType font/woff2 "access plus 1 year"
  ExpiresByType application/font-woff "access plus 1 year"

  # CSS, JavaScript
  ExpiresByType text/css "access plus 1 year"
  ExpiresByType text/javascript "access plus 1 year"
  ExpiresByType application/javascript "access plus 1 year"

  # Others
  ExpiresByType application/pdf "access plus 1 year"
  ExpiresByType image/vnd.microsoft.icon "access plus 1 year"
</IfModule>

现在，新网页的菜单设计看起来很糟糕。如果我清除浏览器缓存，一切看起来都很好。但许多客户端仍然从浏览器缓存加载，然后页面（菜单）看起来很糟糕。我能做些什么？我等不及 1 年了，直到所有浏览器缓存重新加载 CSS 等。

我正在运行带有 SP Pagebuilder Pro 的 Joomla 4 和一个名为 Flex 的模板。

Answer 1

最可靠的方法是更改所有图像、CSS 和 JS 资源的文件名。实现此目的的一种简单方法是在它们上包含一个缓存清除查询字符串。例如，您可以使用

<img src=foo.png>

，而不是

<img src=foo.png?version=1.3>

。

网络服务器将忽略查询字符串并提供当前图像。但是，由于 URL 不同，查询字符串将强制浏览器获取新图像。