Angular2强制/硬重载浏览器缓存脚本？

Question

我知道网上有很多关于这方面的帖子，但没有一个人满意我。 大多数人建议在每个脚本/ css文件中附加一个verizon编号。但这对我来说听起来像是很多工作（项目是qute bit），也许有一些方法只能输出文件，有些CLI命令我不知道？

我的解决方案基于对新版本号的简单ping API，当＆gt;比存储然后重新加载页面。这是一个棘手的部分 - 即使location.reload(true)不刷新缓存的角度内容。手动CTRL + SHIFT + R可以很好地完成这项工作。如果程序化的重新加载可行，那对我来说就足够了。

我也试过this.compiler.clearCache();但也没有效果。

提前致谢！ ：）

Answer 1

@angular/cli会为您阻止缓存。如果您使用ng build标志运行-prod，它会将哈希附加到脚本/ css文件名。

Answer 2

编辑：如果您使用的是角度cli，@ Tomasz的答案可能比下面列出的方法更好。

理想情况下，您可以使用像Webpack这样的模块捆绑器或像Grunt这样的任务运行器来自动“指纹”您的文件（即，根据文件名的内容为文件名添加唯一标识符）。

但如果这不是一个选项，那么简单的黑客就是：

1. 在HTML上设置缓存标头以避免在浏览器上缓存
2. 将随机查询参数附加到HTML中的脚本标记网址，您可以在每次需要新版本时更改这些网址。

<script src='/js/some.js?v=1.1.3'></script>

更改随机查询参数（示例中为v）将确保浏览器发出新请求，因为该URL与缓存（较旧）版本不同