Angular PWA 推送通知

Question

我已阅读有关 PWA 和推送通知的文档。但是，我不清楚以下策略，因为我将这些概念与 pubsub 策略联系起来。 我需要什么：当用户被分配某些任务（通过另一个后端服务发生）时，我会在我的 web 应用程序上以 chrome 向用户显示通知

到目前为止，我所做的是创建带有 PWA 的 Angular 应用程序，并且通知为 mentioned here。我需要单击应用程序上的某个按钮才能获得通知。但这不是我想要的。如果分配了任何任务，我想通知用户（用户可能会或可能不会积极使用我的应用程序）。

我是否需要定期从角度调用subscribeToNotifications 来检查是否有任务。这让我很困惑。谁能解释一下这些是如何工作的？

Answer 1

subscribeToNotifications 基本上只调用一次。 该功能的目的是请求用户发送推送通知的权限，以及接收订阅信息并保存。 所以调用subscribeToNotifications函数一次后，就不需要再调用该函数了，因为用户的订阅信息已经保存好了，你可以根据订阅信息随时发送通知。

更多细节：

向用户发送通知需要用户的第一个权限。这实际上是示例 from this article that you brought 中 subscribeToNotifications 函数的第一部分：

this.swPush.requestSubscription({
    serverPublicKey: this.VAPID_PUBLIC_KEY
})

如果用户允许通知，您需要保存订阅对象。订阅对象中的信息是向该用户发送推送通知所必需的。

这是该示例的延续，在.then 部分中，您可以获得订阅。 newsletterService 中的addPushSubscriber 函数负责保存它。

this.swPush.requestSubscription({
     serverPublicKey: this.VAPID_PUBLIC_KEY
})
.then(sub => this.newsletterService.addPushSubscriber(sub).subscribe())

现在对象已保存，您可以使用该对象通过 webpush 库发送推送通知。