管理浏览器缓存

Question

我正在构建一个web应用程序。我链接到单独的css和js文件，我想管理缓存。如果脚本js或样式css文件已经更新，则强制重新加载并替换该文件，否则从缓存中获取该文件。这有可能吗？如何做到这一点？

Answer 1

作为默认的css和javascript文件在客户端浏览器中兑现。当你更新你的css或javascript文件时，只需要在HTML头文件中更新和增加版本，如下所示：

foo.css?ver=002
foo.js?ver=002

Answer 2

这在很大程度上取决于服务器，因为浏览器中的缓存基于服务器发送的一组标头，包括Cache-Control、Expires、Etag，以及处理来自客户端的标头的方式(包括If-Modified-Since和If-None-Match )。这允许浏览器仅在没有最新版本的文件时才尝试请求服务器返回文件；如果服务器根据头文件确定浏览器已经具有最新版本，则可以返回响应304 not modified。

您还可以按照sia的建议使用"cache buster“查询参数:在文件名中添加一个查询参数，该参数将被大多数服务器忽略，但您可以使用该参数来指示同一文件有一个新版本。虽然query参数不能让您控制下载的版本，但它将是浏览器缓存中关键字的一部分，因此当参数更改时，浏览器将再次下载该文件。

这里有一个很好的how HTTP caching works over on MDN概要。