我如何在 Angular 应用程序中订阅/收听 chrome 推送通知

Posted

技术标签:

【中文标题】我如何在 Angular 应用程序中订阅/收听 chrome 推送通知【英文标题】:How can i subscribe/listen to chrome push notifications in angular app 【发布时间】:2019-07-29 06:29:37 【问题描述】:

我正在使用 Angular 7 构建一个应用程序,作为其中的一部分,我必须将我们的警报系统生成的所有浏览器通知显示到应用程序仪表板中, 到目前为止,我不确定如何在 Angular 应用程序中捕获/收听这些通知,并在它们生成并显示在仪表板上时立即收听/捕获它们。

【问题讨论】:

到目前为止你有什么尝试? 我已经检查了这篇文章developer.mozilla.org/en-US/docs/Web/API/Notification/onshow,但还没有成功实现它.. 这个拼图实际上有很多部分。您是否有发布 PushNotifications 的 PubSub 服务?您可能还想查看this out 我所说的通知是由我无法控制的第三方网站生成的,但会为我们创建警报并通过通知通知我们, 【参考方案1】:

您可以在 Angular 端使用 EventSource 之类的东西来访问服务器端事件。

  var source = new EventSource('http://localhost:8080/stream/employees');

         source.onmessage = (event) =>
          var data = event.data
           console.log(data)
           this.toast.show('User is '+ data.firstname)
       

以上是访问服务器端事件并在 Angular 端显示它们的基本示例。

我需要您提供更多信息,数据是如何从服务器端推送的,以及您尝试在 Angular UI 上显示什么通知。

【讨论】:

警报由第三方网站通过 chrome 桌面通知通知

以上是关于我如何在 Angular 应用程序中订阅/收听 chrome 推送通知的主要内容,如果未能解决你的问题,请参考以下文章

Firebase:如何停止收听快照

如何在 Angular 和 RxJs 中管理多个顺序订阅方法?

如何使用提供程序包收听更改并在颤振中重建小部件?

如何在节点应用程序中使用 prisma graphql 订阅

如何在 Google Cloud App Engine 上使用 PubSub 创建订阅者,该订阅者通过 Publisher 从 Google Cloud App Engine Flex 收听消息?

如何在不订阅 Angular 表单提交的情况下创建/更新项目