如何启用Angular PWA服务工作者



在Angular项目中,使用命令行运行以下命令:

ng add @angular/pwa  
ng build --prod

/dist文件夹中的输出已作为静态网站发布
https://azureadb2ctesting1.z9.web.core.windows.net/

当通过PWABuilder运行URL时,会检测到清单,但不会检测到服务工作者。此外,当Chrome devtools中的网络更改为offline时,页面不会正常加载,而是显示"没有Internet连接"。

还要注意控制台中的以下错误:

main.cb0300ed077227f6fc7f.js:1服务工作者注册失败,原因是:DOMException:未能为作用域('https://azureadb2ctesting1.z9.web.core.windows.net/'(和脚本('https://azureadb2ctesting1.z9.web.core.windows.net/ngsw-worker.js'(:脚本具有不受支持的MIME类型('text/plain'(。

如何为此Angular PWA启用服务工作者?

在angular.json中,您应该具有:"serviceWorker": true

在应用程序根模块中,导入中应该有以下行:

ServiceWorkerModule.register('/ngsw-worker.js', { enabled: environment.production })

最新更新