Angular6 Service Worker和后台同步 [英] Angular6 Service Worker and background sync

问题描述

angular6 似乎不支持与Service Worker进行后台同步。在有角度的服务中没有任何库的情况下，执行此操作需要采取哪些步骤？

it seems that angular6 does not support background syncing with service worker. What are the steps required to do this without any library in an angular service?

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

如何直接在 angular6 应用程序中访问 WorkerGlobalScope ，以便可以进行后台同步。

How and where can I access WorkerGlobalScope in an angular6 application directly so that background sync can be done.:

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

问题是角度CLI会生成servicworker文件（ ngsw-worker.js ）。有没有办法注入 / 修改 / 扩展此文件？是的，我可以手动或使用其他技巧来编辑文件 ngsw-worker.js 。有官方的方法吗？

The problem is that the angular CLI generates the servicworker file (ngsw-worker.js). Is there a way to inject / modify / extend this file? Yes, i can edit the file ngsw-worker.js by hand or with another fancy trick. Is there an official way to do this?

推荐答案

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

Yes you can use your custom script to extend the capabilities of Angular's service worker.

只需执行以下步骤：

1. 使用自定义脚本创建js文件假设您项目的src目录下的 sw-custom.js
   。


2. 添加 在 sw-custom.js 文件顶部的importScripts（'./ ngsw-worker.js'）。


3. 在脚本部分的 angular.json 文件中添加 sw-custom.js 文件。


4. 现在在应用模块中注册您的 sw-custom.js 文件，而不是

1. Create a js file with your custom script let's say sw-custom.js under src directory of your project.
2. Add "importScripts('./ngsw-worker.js')" at top of sw-custom.js file.
3. Add sw-custom.js file to angular.json file under scripts section.
4. Now register your sw-custom.js file in app module instead of

ngsw-worker.js

ngsw-worker.js

现在就是了，您可以根据需要在此处编写脚本。

That's it now you can write your script here as per your need.

也许这不是正确的方法，但是可以。

Maybe it is not correct approach but it works.

这是博客相同。

这篇关于Angular6 Service Worker和后台同步的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！