Question

我正在尝试在我的一个AngularJS应用程序中实现服务工作者。根据教程（主要是MDN），我提出了以下实现来将它与AngularJS合并。

首先，因为app.run()似乎是正确的地方。我在run块中有以下代码：

if ('serviceWorker' in navigator) {
  navigator.serviceWorker.register('workerFile.js')
  .then(function(reg) {
    console.log('Registration done');
  },function(error) {
    console.log('Registration failed with ' + error);
  });
}

我的服务工作者文件如下：

this.addEventListener('install', function(event) {
  event.waitUntil(
    caches.open('v1').then(function(cache) {
      return cache.addAll([
        'index.html'
      ]);
    })
  );
});

和

this.addEventListener('fetch', function(event) {
  event.respondWith(
    caches.match(event.request)
  );
});

完成此操作后，我希望我的index.html文件可以缓存并脱机使用。但那还没有发生。在线时，每次为服务器提供文件（在提琴手中看到）。

我尝试在工作文件中将this更改为self。这没有用。此外，我目前正在localhost进行测试，所以我认为它不应该有不安全的浏览问题。我对JavaScript中的Workers概念很陌生，因此没有足够的选项可以尝试。

有人能指出我的错误吗？显然，互联网上的文章并不多。

P.S：我访问了this问题：没多大帮助。

更新：再看一下这些文档，我相信它在注册时与scope属性有关。我该如何定义此属性以包含我的整个应用程序？我尝试使用{scope: '/'}，但似乎无效。

如何在AngularJS应用程序中实现服务工作者以实现脱机体验

0 个答案: