带版本控制的缓存破坏似乎不起作用

Question

我目前正在使用版本控制来中断缓存。我用日期或版本来生成不同的文件名。但是，它会破坏google缓存页面，因为google会查找旧文件名。

我有一个webpack设置的分块。

output.filename = '[name].js?v=' + hash
output.chunkFilename = '[name].js?v=' + hash

我可以看到浏览器请求文件v=xxx是正确的

然而，有时我需要让我的客户打开开发工具并单击清除缓存和硬刷新因为正常刷新不工作。

我也使用Cloudflare cdn，它确实有缓存策略。Cloudflare响应头。

cache-control: max-age=31536000
cf-bgj: minify
cf-cache-status: HIT
cf-polished: origSize=9873

如何确保浏览器和cloudflare清除所有的js和css文件时，新的代码推送?

当正常刷新不工作时不知道该怎么做。

Answer 1

在Cloudflare上，有几种方法可以控制缓存的行为

• 了解Cloudflare CDN(一般规则)
• 缓存级别(可以配置为考虑或忽略查询字符串)
• 页面规则(用于基于URL模式微调缓存行为)
• 源缓存控制(控制基于你的源服务器返回的缓存头的行为)

您还有各种选项(取决于计划)，可以通过缓存清除(从仪表板或通过api)主动清除某些资源。

有必要检查上述设置(特别是缓存级别和页面规则)，以验证querystring是否被视为用于检索数据的缓存键的一部分。特别是，标头cf-cache-status: HIT表示请求的资源是从CDN缓存副本中获取的。