使用 Angular2 的 Service Worker 推送通知

Posted 2023-02-19

【中文标题】使用 Angular2 的 Service Worker 推送通知

【英文标题】：Service Worker Push Notifications with Angular2

【发布时间】：2016-07-24 11:09:45

【问题描述】：

我正在尝试拼凑通过服务工作者向用户推送通知的一般工作流程。

我已经关注thisGoogle Developers 服务工作者推送通知教程，目前正在考虑如何在一个基于用户的小型网络应用程序中实现这种东西以进行实验。

在我看来，支持推送通知的 Web 应用的一般工作流程如下：

客户访问应用程序 Service Worker 产生一个推送通知端点 客户端将端点发送到服务器 服务器将端点与为其生成端点的当前用户相关联 每当您的应用程序认为值得通知的事情发生时，服务器都会抓取与用户关联的推送通知端点，并点击它以向任何用户设备发送推送通知（可能带有数据有效负载） Chrome 50+ 等）

基本上我只是想确认我对这项技术的总体实施想法是准确的，否则如果我遗漏了什么，请获得反馈。

【问题讨论】：

抱歉，不清楚您的问题是什么，您能否改述一下哪里有混淆/担忧？干杯，马特

@GauntFace 对不起！为了清楚起见，我重新措辞。我只是想看看我对在应用程序中实现这一点的想法是否准确，或者是否有一些更简单的方法

【参考方案1】：

你说得很好，有些细节不太正确（但这主要是措辞，可能因个人口味而异）。

客户访问应用程序 注册要用于推送消息的 Service Worker 使用 service worker 注册订阅用户推送消息，此时用户代理将配置一个端点 + 用于加密负载的附加值（如果用户代理支持它）。 客户端将端点发送到服务器 服务器存储端点和数据以备后用（如果服务器有用户帐户，则服务器可以将端点与当前用户关联）。 当服务器希望向用户发送通知时，它会抓取适当的端点并调用它们，这将唤醒服务工作人员，然后服务工作人员可以显示通知。

在 Chrome 50+ 中提供有效负载支持，在撰写本文时，Firefox 支持有效负载，但在 3 个不同版本的 Firefox 中，有效负载使用了 3 种不同版本的加密，所以我会等待有效负载支持故事在使用它/依赖它之前要解决一点。

【讨论】：

谢谢！推送通知端点是否与特定的服务工作者相关联，对吗？我感到困惑的一件事是，假设用户在两个不同的设备上加载站点（生成服务器保留的两个不同的推送通知端点）。假设一个站点更新到来并且一个新的服务工作者被注册（新的推送通知端点生成），现在用户在数据库中可能有 4 个端点与它们相关联，但只有两个有效的......这种模式继续下去，我们已经有 50 个端点/用户只有几个是“最新的”......似乎有利于大量泄漏

随着新端点的生成，处理正确的端点似乎有点困难

关于此的几件事： - 用户代理不一定会在新的服务工作者上发布新的推送订阅（端点 + 其他信息） - 当您使用推送订阅发送推送消息时，响应会告诉您订阅是否仍然有效 - 在这种情况下，您可以清除旧的 - 如果它成为一个问题/问题，可以使用 indexdb 之类的东西跟踪以前没有的订阅并检测更改并删除旧的推送订阅与新的