javascript - 如何在 Visual Studio 中自动将 md5 哈希的版本号添加到 javascript 和 css 文件或使用其他方式强制刷新浏览器缓存？

Question

每当我为任何 Web 应用程序推出新版本的 CSS 或 javascript 文件时，我都会手动将 ?v=# 添加到 HTML 头部的 URL(# 是版本号，例如 3 或 10)，以确保用户浏览器缓存不会妨碍更改。

但是有些应用程序的头部有多个 CSS 和多个 JS 文件，跟踪所有更改的文件非常繁琐。

我们在 IIS 服务器上使用 ASP.NET 平台，因此使用 What is an elegant way to force browsers to reload cached CSS/JS files? 的答案不可能，但我正在寻找类似的东西。最好都是 JavaScript。

我喜欢那篇文章中使用 md5 哈希的建议，但我似乎找不到计算 CSS 或 JS 文件校验和的方法。

代码看起来像这样(使用 jQuery):

$.each($("script[type='text\javascript']"),function(){
    $(this).attr("src",$(this).attr("src") + "?v=" + checkMD5Sum($(this).attr("src")) );
});

function checkMD5Sum(url){
    //get the hash or something to auto version the file
    //I could send the url or filename to a webmethod to get the MD5 check sum, but doing this after page load is not usefull, so what to do?
}

或者也许在 Visual Studio 中使用构建后过程，但我从未这样做过，所以我不愿意尝试。

<小时/>

编辑

将按照 Adding Caching Profiles 在 web.config 中尝试此操作

<configuration>
   <system.webServer>
      <caching enabled="true">
         <profiles>
            <add extension=".js" policy="CacheUntilChange" />
            <add extension=".css" policy="CacheUntilChange" />
         </profiles>
      </caching>
   </system.webServer>
</configuration>

Answer 1

您的解决方案似乎要求浏览器获取文件两次，并且无法保证第一次获取的状态。所以它不起作用。

缓存由服务器控制。无法决定新版本何时在客户端上可用 - 除非您忽略缓存并始终获取新副本。

实现缓存策略的方法有很多种。使用版本号进行指纹识别就是其中之一。

我更喜欢使用ETag s。将 ETag 设为 filemtime 就可以了。