如何在Web应用程序中更改时加载新图像

Question

如何在Web应用程序中推送新图像以避免缓存？ 当我有一个新的JS或CSS文件时，很容易。 因为他们在smarty模板中，并且我在URL中有一个版本号（如a.js？v = 9）。

现在，随着图像的问题有： -

它们从CSS文件中提到，我不能有一个版本的变量存在。

那么，你是怎么做到的？

Answer 1

在清洁和容易的方法之间的中间，我将：

• 在CSS中，指向与含有不同标记物的URL的图像;像“image.png?VERSION_NUMBER”（literaly）
  • 这将允许同时深化发展
  • 为了避免与缓存中的任何问题，我会配置Apache（在开发计算机上），以指示文件中使用的CSS文件不应该被缓存浏览器
• 我会用某种“打造过程”，将由真正的版本号在每一个CSS文件替换该VERSION_NUMBER标志（也可能是，JS，PHP，HTML，...）
  • T他会创建修改过的文件，包含了正确的版本号
  • 这些文件将被部署到Web服务器
  • 理想的偏多，VERSION_NUMBER可能是每个文件的SVN修订;这样，只有真正修改过的文件才会被修改;但也比较困难：对于每个文件（CSS文件中的每个URL！），在更换标记之前必须确定它是修订版本号！

如果一些浏览器做，因为查询字符串中不缓存图片/ JS/CSS，标记可以被包括在该文件的名称。

而现在，你有一个“构建过程”，你也可以用它来进行一些其他操作，如缩小JS和CSS文件，例如

作为一个方面说明：是的，创建和测试构建过程/脚本需要一些时间;通过PHP来服务CSS文件可能更容易，使用那些变量来指示版本号......但是，对于表演，提供CSS文件（每个PHP页面至少一个;可能更多！）不会那么明智;所以，可能更好地花更多的时间来编写构建过程...

Answer 2

您可以在更改图像文件的同时手动更改CSS文件，并将“？v = 1”放在图像url的末尾。

您也可以将您的服务器配置为通过PHP处理器发送CSS文件，因此您可以在其中粘贴一些PHP代码以在图像url上设置“？v = 8”查询字符串。

Answer 3

作为我的构建过程的一部分，我将一个查询字符串追加到JavaScript包含和具有该文件的LastModified日期/时间长的图像URL。这允许缓存在应用时工作，并且自动化一些容易让开发人员忘记的事情。