ReactJS：如何防止浏览器缓存静态文件？

Question

我正在使用 ReactJS 处理我的项目，并create-react-app用于创建我的应用程序。构建项目后，我使用我的服务器为build文件夹提供服务。当我更新我的应用程序时，用户的浏览器仍然使用我应用程序的旧版本，因为它缓存了静态文件（js、css）。那么有什么办法可以防止浏览器缓存静态文件呢？谢谢 ！

Answer 1

TLDR：您将希望通过 HTTP 标头发送缓存指令。

该Cache-Control头有几个指令，以控制缓存行为，过期和验证。

缓存行为：https : //developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Cache-Control

Cache-Control：公共资源可以被任何缓存缓存

Cache-Control：私有资源只能被浏览器缓存

Cache-Control: no-store 设置浏览器总是从服务器请求资源

Cache-Control: no-cache 这告诉浏览器缓存文件但不使用它，直到它与服务器检查以验证我们有最新版本。此验证是通过 ETag 标头完成的。( https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/ETag )