问题描述
我有一个使用Angular PWA和服务工作者的Angular 8 Web应用程序。
客户希望向系统添加维护模式，以便能够切断用户并显示带有停机时间信息的简单HTML页面。
在服务器端，只需返回503和维护模式HTML页面即可。虽然页面是基于模板的，但我无法将其包含在SPA webapp中，因为客户的管理员可能希望根据情况进行调整（例如，说明维护将持续多长时间）。
问题归结为： 如何强制网络浏览器显示带有维护文本而不是缓存的index.html的远程index.html？通常如何在使用Visual Studio创建的典型Angular SPA应用程序中完成该操作Angular SPA模板？
更长的解释：
问题出在客户端。由于这是一个PWA，主要通过API与后端进行通信，因此，当用户可能会收到503响应时，存在以下三个潜在问题：
-
首次加载网站时。这不是问题，用户可以立即获得维护页面。
-
网站已经加载并且用户正在进行正常的页面刷新（不是完全重新加载）时。这是一个问题，因为服务工作者返回了缓存的SPA根目录index.html，而不是服务器上已修改的index.html。 幸运的是，我的SPA在启动后立即执行了一些Web请求，因此我可以在那里捕获503，因此一切都归结为第三点：
-
在用户执行某些任务并且应用程序调用我的服务器API时，最常见的503状态将被捕获。我在Angular代码的HTTP服务调用中添加了一个基于ErrorHandler的全局错误处理程序，因此我可以捕获503响应。但是接下来我该怎么办？ 我如何强制完全重新加载网站，而忽略服务工作者缓存来强制重新加载远程index.html页面？
我已经尝试过什么：
作为一种快速而肮脏的解决方法，我在错误处理程序中添加了以下代码：
if (error.status === 503) {
// the server should have offline page. If not,the request will lead to 404.
document.location.href = "offline.html?_=" + Math.floor(Math.random() * 1000000000);
}
这假定远程服务器具有offline.html文件，而不是新修改的index.html。 这种方法的问题在于，用户将无法简单地继续刷新页面，因为从服务器从维护模式中恢复后，他们将获得offline.html，最后是404而不是已恢复的index.html。最好将维护文本强制设置在相同的index.html中，但是不幸的是，浏览器一直在显示缓存的SPA index.html。
解决方法
暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！
如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@）