我正在尝试按以下说明配置服务工作者:https://angular.io/guide/service-worker-getting-started,但是它不起作用。
export class CheckForUpdateService { constructor(updates: SwUpdate, @Inject(PLATFORM_ID) private platformId: Object) { if(isPlatformBrowser(this.platformId) && updates.isEnabled) { console.log('create update service'); updates.available.subscribe(event => { console.log('current version is', event.current); console.log('available version is', event.available); }); updates.activated.subscribe(event => { console.log('old version was', event.previous); console.log('new version is', event.current); }); interval(5000).subscribe(() => { updates.checkForUpdate().then(() => console.log('checking for updates')); }); updates.available.subscribe(event => { alert('new version available'); updates.activateUpdate().then(() => { alert('prepare for reload'); document.location.reload(); }); }); } } }
export class AppComponent { constructor(checkForUpdate: CheckForUpdateService) { } }
ng build --prod
和http-server
软件包运行服务器 ngsw.json
的内容:
{ "configVersion": 1, "index": "/index.html", "assetGroups": [ { "name": "app", "installMode": "prefetch", "updateMode": "prefetch", "urls": [ "/5.d50f075c73ef3cb4c819.js", "/6.6d79c1c2e71a562b0e26.js", "/7.f71cb33295df19ab0c82.js", "/common.c67594673251692e7d02.js", "/favicon.ico", "/index.html", "/main.3c8177476921b6cb50a2.js", "/polyfills.9a9cb9ce969a4ed9e53e.js", "/runtime.9288bbbd9a0917a9291a.js", "/scripts.9e2559654737670d2e9e.js", "/styles.76eb17c699edd3b8c83d.css" ], "patterns": [] }, { "name": "assets", "installMode": "lazy", "updateMode": "prefetch", "urls": [ "/assets/icons/icon-128x128.png", "/assets/icons/icon-144x144.png", "/assets/icons/icon-152x152.png", "/assets/icons/icon-192x192.png", "/assets/icons/icon-384x384.png", "/assets/icons/icon-512x512.png", "/assets/icons/icon-72x72.png", "/assets/icons/icon-96x96.png", "/assets/shared/fonts/Lato-Black.woff", "/assets/shared/fonts/Lato-Black.woff2", "/assets/shared/fonts/Lato-Bold.woff", "/assets/shared/fonts/Lato-Bold.woff2", "/assets/shared/fonts/Lato-Regular.woff", "/assets/shared/fonts/Lato-Regular.woff2", "/assets/shared/fonts/Lato-Semibold.woff", "/assets/shared/fonts/Lato-Semibold.woff2", "/assets/sprites/shared.svg" ], "patterns": [] } ], "dataGroups": [], "hashTable": { "/5.d50f075c73ef3cb4c819.js": "3083c7fa0b549bb934af4b413c67f0b93d7d1f0b", "/6.6d79c1c2e71a562b0e26.js": "bb2cdcd9493f3346fe834f396e82c154e9339eaa", "/7.f71cb33295df19ab0c82.js": "6a9aed93736f8472f4477ab6a9b8141bd0ef90a0", "/assets/icons/icon-128x128.png": "dae3b6ed49bdaf4327b92531d4b5b4a5d30c7532", "/assets/icons/icon-144x144.png": "b0bd89982e08f9bd2b642928f5391915b74799a7", "/assets/icons/icon-152x152.png": "7479a9477815dfd9668d60f8b3b2fba709b91310", "/assets/icons/icon-192x192.png": "1abd80d431a237a853ce38147d8c63752f10933b", "/assets/icons/icon-384x384.png": "329749cd6393768d3131ed6304c136b1ca05f2fd", "/assets/icons/icon-512x512.png": "559d9c4318b45a1f2b10596bbb4c960fe521dbcc", "/assets/icons/icon-72x72.png": "c457e56089a36952cd67156f9996bc4ce54a5ed9", "/assets/icons/icon-96x96.png": "3914125a4b445bf111c5627875fc190f560daa41", "/assets/shared/fonts/Lato-Black.woff": "a612d1d7601bf159b10aacd615a0a5077dfdd2ca", "/assets/shared/fonts/Lato-Black.woff2": "15cbaaac8386285a78fce886eb34a85aa0945496", "/assets/shared/fonts/Lato-Bold.woff": "fee666528a8a52ad95015218f5f606e4819b0f26", "/assets/shared/fonts/Lato-Bold.woff2": "d50d1a56d66cf1991f7c21c0ca7b7501c504868d", "/assets/shared/fonts/Lato-Regular.woff": "750dda1f007c465fded21890968b5417000f0f3d", "/assets/shared/fonts/Lato-Regular.woff2": "2243bf872bf09530c171f1ea0bba979f87c5260f", "/assets/shared/fonts/Lato-Semibold.woff": "a4a0fbb0d03f2175ad34fc0ed467761e4a8c12f4", "/assets/shared/fonts/Lato-Semibold.woff2": "c9a987a1a51656fd069593d05a81f8dffb203d54", "/assets/sprites/shared.svg": "f49e3ecf0e0a0abb6637e8024d00386db9f88529", "/common.c67594673251692e7d02.js": "ee2d2410c3954e545f393d37de7f2958a6c5b589", "/favicon.ico": "84161b857f5c547e3699ddfbffc6d8d737542e01", "/index.html": "082db5a4f46abab95756c176fa71cf7fa3f9a2bc", "/main.3c8177476921b6cb50a2.js": "015f68f73d8ccd90f50c5d626b4ef356afb65187", "/polyfills.9a9cb9ce969a4ed9e53e.js": "8b97e0b0f844afd0f56ce19901a24b6892737aea", "/runtime.9288bbbd9a0917a9291a.js": "7a4808385055b952e1c8152b2da283223d887492", "/scripts.9e2559654737670d2e9e.js": "de3743672bea0396cc95f4e1ceb4fe0a41e50149", "/styles.76eb17c699edd3b8c83d.css": "b1b9fb99c63561410b127423c33072bc2f7ce191" }, "navigationUrls": [ { "positive": true, "regex": "^\\/.*$" }, { "positive": false, "regex": "^\\/(?:.+\\/)?[^/]*\\.[^/]*$" }, { "positive": false, "regex": "^\\/(?:.+\\/)?[^/]*__[^/]*$" }, { "positive": false, "regex": "^\\/(?:.+\\/)?[^/]*__[^/]*\\/.*$" } ] }
看看:
"/5.d50f075c73ef3cb4c819.js": "3083c7fa0b549bb934af4b413c67f0b93d7d1f0b"
当我更改模块中的某些代码并使用ng build --prod
重建项目时,ngsw.json
中模块的哈希值发生了变化:
"/5.c68a247a88c3a07be21b.js": "b279b664a0848071c59da5c33e31de0f3eb952a9"
但未触发可用事件。
为什么?