新部署 Angular2 应用程序后如何刷新浏览器

Question

所以我有几个客户端使用我的 Angular 2 应用程序打开了浏览器窗口。然后我执行 ng build --prod，并将新构建发布到服务器。

如何强制客户端刷新所有缓存的脚本？

Answer 1

我刚刚完成了针对这个问题的解决方案。

我尝试了几种不同的方法，但最终维护了一个单独的 json 文件，应用程序可以在设定的时间间隔内请求该文件并与当前加载的版本进行比较，然后采取相应的行动。

我还使用了 google 的 sw-precache 和其他一些我希望能让问题消失的东西。SW-Precache这看起来很棒，但并不能完全可靠地解决我们的问题，因为我找不到安排定期检查以使相关缓存无效的方法。

问题 1：将新文件添加到 angular-cli.json 中的资产块，以便将其复制到分发文件夹中，而不包含在构建的 js 文件中，因为这将否定我们正在尝试的全部内容做。

  "assets": [
    "assets",
    "favicon.ico",
    "web.config",
    "version.json"
  ],

然后我简单地创建了一个简单的服务，其中有一个函数来请求这个文件，另一个用于设置和间隔来重复调用请求。我还选择通过将 unix 时间戳作为查询参数来对这些请求使用“硬”缓存破坏。这可能是老派，但它确保无论设置什么或在哪里设置，您都不会获得 version.json 文件的缓存版本。

最后，我会推荐一些方法来保持这个 version.json 文件与您的应用程序的版本号保持一致。快速搜索带给我

NPM 上的版本化

在 npm install 之后，它允许对语义版本号进行非常简单的修改。我在我的 package.json 中添加了一些脚本来自动确保 version.json 在构建之前与 package.json 一致，只是为了确保没有因为代码已更改而引起的故障，但版本尚未更改。