您如何链接 GCM chrome 推送通知和有效负载数据？答案

【问题标题】：How do you link GCM chrome push notifications and payload data?您如何链接 GCM chrome 推送通知和有效负载数据？
【发布时间】：2016-06-14 08:22:24
【问题描述】：

通过 GCM 在 Chrome 中推送通知让我发疯。

我已经启动并运行了一切。我使用我的 python 服务器将推送服务到 GCM。服务人员很好地显示推送通知。

据我所知，推送事件没有传递任何数据。听起来它即将推出，但尚未推出。

所以就在推送通知显示之前，我调用我的服务器来获取推送通知的额外数据。但我没有关于推送通知的信息发送到我的服务器以匹配并返回相关数据。

我能想到的与通知和用户数据相匹配的一切都纯属推测。我能找到的最接近的东西是 PushEvent{} 上的时间戳对象，它与每个用户的 GCM 调用的成功返回大致匹配。

那么其他人如何处理自定义有效负载数据以显示 Chrome 推送通知？

PushEvent{} 似乎没有任何关联的 ID。我知道推送的用户是因为我之前在注册时存储了该信息。

但是一旦我收到推送，我就不知道推送是为了什么。

我想避免：

尝试根据时间戳进行匹配（因为不能保证通知显示是即时的）。
尝试为用户提取“最新”数据，因为在我的情况下，可能会同时针对不同的数据位发送多个通知。

Whatsapp 和 Facebook 等其他网站如何通过推送通知将自定义有效负载数据与看似无效的事件数据联系起来？

你做得怎么样？有什么建议？

这是我的接收器代码的样子：

self.addEventListener('push', function(event) {

    event.waitUntil(
    fetch("https://oapi.co/o?f=getExtraPushData&uid=" + self.userID + "&t=" + self.userToken).then(function(response) {  
      if (response.status !== 200) {  
        console.log('Looks like there was a problem. Status Code: ' + response.status);
        throw new Error();  
      }

      return response.json().then(function(data) {  
        if (data.error || !data.notification) {  
          console.error('The API returned an error.', data.error);  
          throw new Error();  
        }  

        var title = data.notification.title;  
        var message = data.notification.message;  
        var icon = data.notification.icon;  

        return self.registration.showNotification(title, {  
          body: message,  
          icon: icon,  
        });  
      });  
    }).catch(function(err) {  
      console.error('Unable to retrieve data', err);

      var title = 'An error occurred';
      var message = 'We were unable to get the information for this push message';  
      var icon = "https://oapi.co/occurrences_secure/img/stepNotify_1.png";  
      var notificationTag = 'notification-error';  
      return self.registration.showNotification(title, {  
          body: message,  
          icon: icon,  
          tag: notificationTag  
        });  
    })  
);  
});

【问题讨论】：

标签： javascript google-chrome push-notification google-cloud-messaging

【解决方案1】：

我了解您的问题，当我想使用 chrome 通知时，我一直在摆弄同样的问题。您可以使用 indexedDB 来保存 ObjectStore 并在 webServices 中检索数据。

Web 服务可以访问 IndexedDB。我用它来存储用户信息，当用户收到推送通知时，我通过存储的访问密钥来识别用户并向他传递相关信息。这是 matt gaunt 的教程，它说索引数据库可供 Web 服务访问： http://www.html5rocks.com/en/tutorials/service-worker/introduction/

这是一个很好的 indexedDB 教程： http://blog.vanamco.com/indexeddb-fundamentals-plus-a-indexeddb-example-tutorial/

【讨论】：

感谢您的回复。不幸的是，这并不能解决我的问题。想象一下，一个用户可能有 5 个推送通知，它们都同时推送，并且包含针对特定用户的 5 条唯一消息。当服务人员收到每个推送时，我需要查询我的服务器以检索每个推送的详细信息。但是由于这 5 次推送中的每一次都不包含任何唯一信息，因此我不确定如何将一次推送与我服务器上的其他详细信息联系起来。（除非它以一种非常 hacky 的方式完成，将未读通知列表存储在服务器上并提取最旧的堆栈 - 例如）
我认为你只需要有点棘手。在我们的例子中，我们将同时通知的数量限制为最新的 3 个。当用户收到此通知时，他会使用他的唯一用户 ID 和我们保存在 indexedDB 中的一些其他信息来调用我们的服务器。使用此信息，我们识别用户并检查我们的数据库以获取该用户应接收并回复的消息。然后，Web 服务会显示来自我们给出的响应的通知。因此，您在推送期间不需要拥有唯一信息，而是可以在工作人员收到推送通知时从服务器检索它们
是的，我们现在所拥有的非常相似——只是看起来很草率。一个简单的唯一 ID，在我们的服务器上推送时生成并与推送一起发送就足以完美地链接两者。似乎应该从一开始就包含一个安全且简单的解决方案。
太棒了...可能在下一个版本中，服务工作者将能够读取与推送通知一起发送的有效负载。他们似乎对此有计划。如果您认为它令人满意，请接受答案。
老实说，我真的不认为这是对我问题的回答。我们只是在讨论实现这项工作的各种技巧。为了后代，我宁愿有一个更具体的答案，以帮助其他人解决这个问题。

【解决方案2】：

假设你还在过去。也就是说，只向浏览器发送一个没有负载的推送触发器，现在是时候继续前进了。您现在可以在推送事件中发送有效负载。由于您似乎对 GCM 很熟悉，尽管现在有独立于浏览器供应商的 Web 推送协议，但可以继续使用。

简而言之，要完成这项工作，您需要使用在您的服务器中找到 here 的规范加密您的有效负载。

据我所知，谷歌浏览器有一个 node 和 PHP 实现。您可以查看PHP Web Push here。

在浏览器中，您现在需要像以前一样在端点顶部提供p256dh 和auth 的订阅对象。

您可以查看this 了解更多详情。

【讨论】：