Angular PWA swPush.requestSubscription() 不工作，错误：服务工作者被禁用或不受此浏览器支持答案

【问题标题】：Angular PWA swPush.requestSubscription() not working, Error:Service workers are disabled or not supported by this browserAngular PWA swPush.requestSubscription() 不工作，错误：服务工作者被禁用或不受此浏览器支持
【发布时间】：2020-09-13 00:56:24
【问题描述】：

我有一个使用 Angular 8 的 Ionic 5 PWA。我使用 swPush 完成了推送通知，它在 3 月之前一直按预期工作。但是，从上个月开始，由于其他一些变化，这停止了工作。我无法隔离问题。

swPush.isEnabled() 返回 false，即使服务工作者已注册。关于 swPush 及其实现，代码中没有任何变化。我试过 this unanswered link 也没有帮助

当我使用 PUSH NOTIFICATION API（使用 PushManager）时，没有错误，一切正常，我正在获取订阅对象。这是 swPush 实现的问题，还是我的错误？

notification-service.ts

this.swPush.requestSubscription({
    serverPublicKey: this.VAPIDPublicKey
  })
  .then((sub: PushSubscription) => {
    const keys: SubscriptionObjectKeys = {
      auth: sub.toJSON().keys.auth,
      p256dh: sub.toJSON().keys.p256dh
    };
    const subscriptionObject: SubscriptionObject = {
      endpoint: sub.endpoint,
      expirationTime: 0,
      keys: keys
    };
    resolve(subscriptionObject);
  })
  .catch(err => {
    console.error('Could not subscribe to notifications', err);
    reject(err);
  });

Chrome 中的错误

Error: Service workers are disabled or not supported by this browser
at e.requestSubscription (service-worker.js:391)
at notification.service.ts:123
at new D (zone-evergreen.js:960)
at t.<anonymous> (notification.service.ts:103)
at Generator.next (<anonymous>)
at tslib.es6.js:73
at new D (zone-evergreen.js:960)
at o (tslib.es6.js:69)
at t.subscribeToSWPush (common-es2015.ffedc7b115b497dcd514.js:1)
at t.<anonymous> (notification.service.ts:61)

我也在 macOS 和 Windows 10 中使用 HTTP Server 和 SSL 进行了检查。两者都显示相同的问题。

我创建了一个新的 Ionic 应用程序并实现了相同的代码，它在那里运行良好。我无法隔离问题。

任何建议都会很有帮助。

【问题讨论】：

您在使用ng serve 进行测试吗？服务人员不适用于ng serve。您需要使用http-server 服务。
不，使用http-server.after ionic build --prod运行
@MichaelD 并不是说“服务人员不与ng serve一起工作”——而是您的网站不需要在localhost上提供服务，而是提供服务通过 HTTPS。
@Edric：感谢您提供的信息。在这种情况下，应该修改 Angular 文档 here。它指出因为ng serve 不适用于服务工作者，您必须使用单独的 HTTP 服务器在本地测试您的项目。
啊——我不太确定服务人员在这种情况下是如何工作的。 stackoverflow.com/questions/55905172/… 似乎本地主机上允许服务工作者：chromium.org/blink/serviceworker/service-worker-faq

标签： angular ionic-framework push-notification progressive-web-apps angular-service-worker

【解决方案1】：

我也收到了swPush.requestSubscription Error: Service workers are disabled or not supported by this browser...。另外，swPush.isEnabled 返回 false。

我不使用ng serve，因为我知道服务人员不会在那里运行。我的 Angular PWA 正在使用 IIS 10、域名和 SSL（使用 https）的临时服务器上运行。检查 chrome 调试（Application > Service Workers）ngsw-worker.js 是#687 activated and is running。除了 swPush 问题，我的 PWA 运行得非常好（就像我的 Windows 10 机器上的桌面应用程序一样）。

我正在使用 Angular 11.2.7。你们解决了这个问题吗？

【讨论】：