角度6-“禁用或不支持服务人员".错误 [英] Angular 6 - "Service workers are disabled or not supported" error

问题描述

我想使用web-push模块和angular service worker推送通知订阅.我已按照以下链接中的说明进行操作:角度推送通知:完整的分步指南指南和使用Angular推送通知& Express ，但通知提示没有按应有的方式显示.我检查了swPush对象，发现它没有启用，而且我什至不知道为什么我完全按照这些链接所说的那样遵循angular/pwa安装说明.希望这里有人能帮忙.非常感谢！

I want to push notification subscription with web-push module and angular service worker. I've followed instructions from these links: Angular Push Notifications: a Complete Step-by-Step Guide and Push Notifications with Angular & Express yet the notification prompt was not showing up as it should. I've checked the swPush object and found out that it was not enabled, and I don't know why even I've followed angular/pwa installation instructions exactly as those links said. Hope someone here can help. Thanks a lot!

我使用自己的Nodejs服务器而不是http-server模块运行该应用程序.

I run the application with my own Nodejs server, not with http-server module.

这是我的推送订阅代码:

Here is my push subcription code:

readonly VAPID_PUBLIC_KEY =
'BIfDkegCvhzctX06rYvwQImhbfAymWYE3wtcog9E4Zj7LOgX6TQFS6fZSqLCt01zBZtc1-jSwpZrZEmTQ2i95V8'; // key generated with web-push

 constructor(
   private user: UserService,
   private httpClient: HttpClient,
   private router: Router,
   private auth: AuthService,
   private swPush: SwPush
 ) {
     this.swPush.requestSubscription({
       serverPublicKey: this.VAPID_PUBLIC_KEY
     })
     .then(subcription => {
       console.log('Send ' + subcription + ' to server');
     })
     .catch(console.error);
}

返回错误:

错误:此浏览器禁用或不支持服务人员 在SwPush.push ../node_modules/@angular/service-worker/fesm5/service-worker.js.SwPush.requestSubscription(service-worker.js:146) 在新的DashboardComponent(dashboard.component.ts:40) 在createClass(core.js:9311) 在createDirectiveInstance(core.js:9186) 在createViewNodes(core.js:10406) 在createRootView(core.js:10320) 在callWithDebugContext(core.js:11351) 在Object.debugCreateRootView [作为createRootView](core.js:10838) 在ComponentFactory_.push ../node_modules/@angular/core/fesm5/core.js.ComponentFactory_.create(core.js:8666) 在ComponentFactoryBoundToModule.push ../node_modules/@angular/core/fesm5/core.js.ComponentFactoryBoundToModule.create(core.js:3315)

Error: Service workers are disabled or not supported by this browser at SwPush.push../node_modules/@angular/service-worker/fesm5/service-worker.js.SwPush.requestSubscription (service-worker.js:146) at new DashboardComponent (dashboard.component.ts:40) at createClass (core.js:9311) at createDirectiveInstance (core.js:9186) at createViewNodes (core.js:10406) at createRootView (core.js:10320) at callWithDebugContext (core.js:11351) at Object.debugCreateRootView [as createRootView] (core.js:10838) at ComponentFactory_.push../node_modules/@angular/core/fesm5/core.js.ComponentFactory_.create (core.js:8666) at ComponentFactoryBoundToModule.push../node_modules/@angular/core/fesm5/core.js.ComponentFactoryBoundToModule.create (core.js:3315)

预期结果:

推荐答案

此错误是由于服务工作者无法使用ng serve引起的.用http-server运行，然后工作正常. 如角度服务工作者所述:

This error was caused due to the reason that service workers don't work with ng serve. Run with http-server then it works fine. As in Angular service workers said:

由于服务不能与服务工作者一起使用，因此必须使用单独的HTTP服务器在本地测试您的项目.您可以使用任何HTTP服务器

Because ng serve does not work with service workers, you must use a separate HTTP server to test your project locally. You can use any HTTP server

这篇关于角度6-“禁用或不支持服务人员".错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！