文件名使用哈希来避免缓存

Question

[名称]。[EXT] [散列]

我对表达式有两个问题：

1. 这有助于避免在浏览器中缓存吗？
2. 实际上在Windows操作系统中，它会发出一个名为 [name]。[ext] 的文件，没有？[hash] 部分。所以，它是不是一个好的解决方案吗？

Answer 1

当你require文件时，webpack会将文件复制到输出目录并返回url。返回的url应该具有文件内容的MD5哈希值，即使复制的文件没有用哈希命名。如果您在代码中使用此URL来加载资源，浏览器将兑现整个网址，而不仅仅是文件名。

因此，如果你有一个名为＆＃39; icon.png＆＃39;您可能希望将其替换为新图标，但保留相同的文件名。当你使用带有哈希的url（即＆＃34; icon.png？FE657AC13EB837AC＆＃34;时，浏览器会使用完整的URL在客户端的计算机上缓存它。由于这包括哈希，如果你改变浏览器将下载一个新副本的图像。如果没有网址中的哈希值，浏览器可以假设＆＃39; icon.png没有更改并使用缓存版本，并且从不检查服务器以查看是否它已经更新。

如果你只使用你的html中没有哈希的文件的url，那就失败了。您可以生成随机数或在查询字符串中使用当前日期，以使客户端每次下载文件（或更改服务器上的标头以禁用缓存），但这不是理想的。通过使用文件的MD5哈希，只要图像具有相同的哈希值，浏览器就可以缓存图像，这实际上意味着它是相同的图像。