Angular6 Service Worker 和后台同步

Question

angular6 似乎不支持与 service worker 的后台同步。在 angular 服务中没有任何库的情况下执行此操作需要哪些步骤？

https://developers.google.com/web/updates/2015/12/background-sync

如何以及在何处可以直接访问 angular6 应用程序中的 WorkerGlobalScope，以便可以完成后台同步。 :

self.addEventListener('sync', function(event) {
  if (event.tag == 'myFirstSync') {
    event.waitUntil(doSomeStuff());
  }
});

问题是 angular CLI 生成了 servicworker 文件 (ngsw-worker.js)。有没有办法注入/修改/扩展这个文件？是的，我可以手动或使用其他花哨的技巧编辑文件 ngsw-worker.js。有官方的方法吗？

Answer 1

是的，您可以使用自定义脚本来扩展 Angular 服务工作者的功能。

只需按照以下步骤操作：

1. 使用自定义脚本创建一个 js 文件 sw-custom.js 在你项目的 src 目录下。
2. 在 sw-custom.js 文件的顶部添加“importScripts('./ngsw-worker.js')”。
3. 将 sw-custom.js 文件添加到脚本部分下的 angular.json 文件。
4. 现在在应用模块而不是
中注册您的 sw-custom.js 文件

ngsw-worker.js

到此为止，您可以根据需要在此处编写脚本。

也许这不是正确的方法，但它确实有效。

这是相同的 blog。