为什么这个文件没有缓存在浏览器中？我的标题有什么问题？答案

【问题标题】：Why is this file not cached in the browser? What's wrong with my headers?为什么这个文件没有缓存在浏览器中？我的标题有什么问题？
【发布时间】：2021-08-27 16:31:53
【问题描述】：

我正在使用 Cloudfront（前面带有 Cloudflare）来提供以下文件：

https://app.astrobin.com/assets/i18n/en.po?version=1623337803841

这些是撰写本文时的响应标头：

accept-ranges: bytes
age: 2825
cf-cache-status: DYNAMIC
cf-ray: 65d3e1df6fe70f9a-VIE
cf-request-id: 0a984b7fa400000f9ac0139000000001
content-length: 6626
content-type: application/octet-stream
date: Thu, 10 Jun 2021 16:12:37 GMT
etag: "6336cef3a9da96c3c432813762cd7d70"
expect-ct: max-age=604800, report-uri="https://report-uri.cloudflare.com/cdn-cgi/beacon/expect-ct"
last-modified: Thu, 10 Jun 2021 15:17:27 GMT
nel: {"report_to":"cf-nel","max_age":604800}
report-to: {"endpoints":[{"url":"https:\/\/a.nel.cloudflare.com\/report\/v2?s=TipuJtVNh6YvmqS4rzXv5mtQ%2BUKVHBvok88InKPm%2FNGqK13b2EX1%2BxMEuMfCgp4qslhW0xc1qeIzX1xpUzNW5u5rC8Di3lsb4zNqaoN0zhhH5E3wbizW%2FjlbqD5C"}],"group":"cf-nel","max_age":604800}
server: cloudflare
via: 1.1 3d4555926457517be3e728d2175d92a3.cloudfront.net (CloudFront)
x-amz-cf-id: MfDo647EBTxmyo7TZ-sseALca4bmzBPdPPnuiesvGjNnlkgqLzgwDA==
x-amz-cf-pop: VIE50-C2
x-cache: Hit from cloudfront

下图是我对该文件的 Cloudfront“行为”规则：

我在 Cloudflare 中没有此文件的任何页面规则。

出于测试目的，我对该文件执行了多个请求，但从未从 Chrome 的磁盘或内存缓存中获取该文件。它总是进入网络。

正如您从请求 URL 中看到的那样，我将最后一次已知修改的时间戳附加到此文件中，用于缓存清除目的，因此我希望将文件缓存在浏览器中。

我错过了什么？谢谢！

【问题讨论】：

标签： caching http-headers amazon-cloudfront

【解决方案1】：

浏览器缓存由原始服务器响应中的缓存标头（即Cache-Control 或Expires）决定。但是您列出的响应没有这样的标头，因此由浏览器决定资源被认为是新鲜的时间。

如果您希望浏览器使用特定的缓存策略，您应该在响应中添加 Cache-Control 标头。

【讨论】：

谢谢，但是last-modified 呢？我包含该标题是假设浏览器将根据last-modified 检查它的最新检索时间并决定是再次获取还是显示缓存页面。
@SalvatoreIovene：不，这不是缓存的工作方式。响应使用Cache-Control 告诉客户端它可以为页面提供多长时间而不需要与服务器进行检查。一旦该时间过去，客户端将创建一个conditional request（使用Last-Modified 和ETag 值）以查看其版本是否仍然是最新的。这部分工作正常，这就是为什么你看到一个小的304 而不是一个大的200。问题是你没有告诉浏览器它应该从浏览器缓存中提供文件多长时间。