我正在使用Angular5和角度服务工作者.
我缓存了一些数据和一些资产,一切都按预期工作正常,甚至部署了代码.
现在,如果我更新一些代码并再次部署,则服务工作者不会更新.
所以,我已经通过Angular service worker链接和我实现了SwUpdate服务.
这是我的代码：
我创建了一个服务并在App Component中调用它
import { Injectable,NgZone } from '@angular/core';
import { interval } from 'rxjs/observable/interval';
import { SwUpdate } from '@angular/service-worker';
import { Observable } from 'rxjs/Rx';
@Injectable()
export class ServiceWorkerService {
constructor(updates: SwUpdate,ngZone: NgZone) {
console.log('Servicee worker update called');
updates.available.subscribe(event => {
console.log('current version is',event.current);
console.log('available version is',event.available);
updates.activateUpdate().then(() => document.location.reload());
});
updates.activated.subscribe(event => {
console.log('old version was',event.prevIoUs);
console.log('new version is',event.current);
});
ngZone.runOutsideAngular(() => {
interval(6000).subscribe(() => {
console.log('Inside Interval')
ngZone.run(() => updates.checkForUpdate());
});
});
}
}
上面的代码做了什么：
>每当部署新代码时,旧的服务工作者都会检测到它.
>然后它订阅updates.available事件.
>我们听那个事件,然后重新加载页面.
问题：
Now,the issue is,it is working perfectly on chrome. But not in
firefox. In firefox,the code is not comming insideupdates.available.subscribe
解决方法
我有同样的问题,并能够通过在main.ts中注册服务工作者来解决它：
platformBrowserDynamic().bootstrapModule(AppModule).then(() => {
if ('serviceWorker' in navigator && environment.production) {
navigator.serviceWorker.register('/ngsw-worker.js');
}
}).catch(err => console.log(err));
我还创建了一个Service worker服务,以便在有新的可用更新时通知用户：
如果您对我的服务工作者服务的外观感兴趣,您可以看到代码here.
您还可以访问yourdomain.com/ngsw/state来检查是否记录了任何错误
