乐趣区

关于javascript:Web-Server-设置缓存响应字段的一些推荐方案

前端开发人员的一个常见误区就是,看到下图这种没有附带 cache control 的 HTTP 响应头部字段,就误认为 HTTP 缓存曾经被禁用了,其实不然。

省略 Cache-Control 响应标头不会禁用 HTTP 缓存!相同,浏览器无效地猜想哪种类型的缓存行为对给定类型的内容最有意义。

版本化的 URL 是一种很好的做法,因为它们能够更容易地使缓存的响应有效。

在响应对蕴含 指纹 (fingerprint) 或版本信息且其内容永远不会更改的 URL 的申请时,请将 Cache-Control: max-age=31536000 增加到您的响应中。

设置这个值通知浏览器,当它须要在接下来一年的任何工夫(31,536,000 秒;反对的最大值)加载雷同的 URL 时,它能够立刻应用 HTTP 缓存中的值,而无需向网络申请远端的 Web 服务器,从而立刻取得了防止网络带来的可靠性和速度。

像 webpack 这样的构建工具能够主动将哈希指纹调配给 asset URL.

可怜的是,理论利用场景中,并非加载的所有 URL 都是版本化的。或者兴许无奈在部署 Web 应用程序之前蕴含构建步骤,因而无奈将哈希值增加到资产 URL。而且每个 Web 应用程序都须要 HTML 文件——这些文件简直永远不会蕴含版本信息,因为如果客户须要记住要拜访的 URL 是 https://example.com,那么没有人会违心应用带有版本信息的 Web 应用程序,比方 /index.13def12.html.

独自的 HTTP 缓存不足以齐全避开网络,须要借助 Service Worker 的帮忙。

以下 Cache-Control 值能够帮忙开发人员微调未版本化 URL 的缓存地位和形式:

  • no-cache:这批示浏览器在每次应用 URL 的缓存版本之前都必须与服务器从新验证。
  • no-store:这批示浏览器和其余两头缓存(如 CDN)永远不要存储文件的任何版本。
  • private:浏览器能够缓存文件,但两头缓存不能。
  • public:响应能够由任何缓存存储。
退出移动版