如何独立控制浏览器与CloudFront的缓存重验证行为？

要实现浏览器缓存sdk.js、同时让CloudFront每次请求都和源站重验证的需求，你可以通过组合Cache-Control指令来精准控制，具体操作如下：

1. 配置S3文件的Cache-Control头 #

把sdk.js的Cache-Control头设为：

max-age=86400, public, proxy-revalidate, s-maxage=0

各指令的作用：

• max-age=86400：让浏览器缓存文件1天（时长可按需调整），有效期内浏览器直接用本地缓存，不用每次都发请求。
• public：允许CloudFront和浏览器这类公共缓存存储文件。
• s-maxage=0：指定CloudFront的缓存有效期为0，意味着CloudFront的缓存会立即过期，每次接收到请求都得去源站（S3）做验证。
• proxy-revalidate：强制CloudFront在缓存过期后必须向源站重验证，搭配s-maxage=0就能实现每次请求都验证的效果。

2. 可选的CloudFront行为补充设置 #

如果想更稳妥地控制CloudFront的行为，可以在对应分发的行为设置里：

• 将最小TTL和默认TTL都设为0，确保CloudFront不会无视s-maxage=0的指令，每次都触发重验证。
• 选择“使用源缓存头”作为缓存策略，让CloudFront优先遵循S3返回的Cache-Control规则。

方案效果说明 #

• 浏览器端：靠max-age实现缓存，减少冗余请求，加快页面加载速度。
• CloudFront端：每次收到请求都会先向S3发送验证请求（带If-Modified-Since或If-None-Match头），如果文件没更新，S3返回304，CloudFront直接返回缓存的文件；如果文件已更新，S3返回新文件，CloudFront更新缓存后再发给浏览器。

这样既满足了浏览器缓存的需求，又保证了CloudFront每次都会校验源站文件的最新状态，完全匹配你的要求。

内容的提问来源于stack exchange，提问作者Andrew Eames