我有几个微前端设置,使用“app-shell”类型的应用程序用于域根和第一个路径元素上的每个微前端。每个应用程序都像一个独立的 Angular 应用程序一样使用共享库来重用通用组件和功能。它们生活在自己独立的 docker 容器中,并使用 nginx 代理映射绑定在一起。
mydomain.com/ <- domain root app
/child1 <- micro apps
/child2
/child3
/child4
Run Code Online (Sandbox Code Playgroud)
我想设置一个 Angular Service Worker 来缓存我们所有的资源。
每个应用程序有一个 Service Worker。所以域根应用程序有一个,我们的每个“子应用程序”都有一个。那是; 一个ngsw-config.json每独立角应用程序。
问题
这导致两个软件在每个子应用程序中争夺缓存控制权,用户最终可能会看到旧版本,具体取决于哪个赢了。
有一个服务人员来统治他们,它发生在域的根应用程序,并把它尝试缓存使用的资源每一个“儿童应用”ngsw-config.json的两种assetGroup.resources.files或assetGroup.resources.urls。这些似乎都不会将子应用程序资源映射到其缓存中 - 至少在检查 DevTools AppCache 存储库时不会,尽管网络选项卡确实报告资源文件是从 ServiceWorker 提供的。
问题
这里的问题是应用程序在部署新版本时不再报告。我猜这是因为 angular-cli 无法知道 child-apps build-time 的编译资源的名称。它们必须在运行时缓存。无论如何,我不能完全确定我的任何资源都被缓存了。通过切换到离线模式,没有任何响应。
此外,我们有时仍然会遇到先加载旧版本的域根应用程序,我们必须刷新页面才能获取更新版本。我已经注入了代码来清理我第一次尝试的第二个 service-worker。以下代码删除注册到的所有服务工作线程mydomain.com/childX:
mydomain.com/ <- domain root app
/child1 <- micro apps
/child2
/child3
/child4
Run Code Online (Sandbox Code Playgroud)
我看到的另一个观察结果是,在 DevTools / Application / Cache 存储中,每个新版本哈希值正好有 4 …