Question

我正在尝试使用Firebase的服务工作者在chrome上实现推送通知。我的网络应用程序中有一个清单文件和一个sw.js文件。我在Firebase中创建了一个项目，并测试了注册和发送通知。除了在接收通知时数据为空，这一切都正常。我不明白为什么，没有任何有用的资源（据我所知！）。这是我的服务工作者文件：

self.addEventListener('push', function(event) {
  console.log('Push message', event);
  var title = 'Push message';
  event.waitUntil(
    self.registration.showNotification(title, {
      body: 'The Message',
      icon: 'images/logo.svg',
      tag: 'my-tag'
  }));
});

这是我的main.js文件：

if ('serviceWorker' in navigator) {
  navigator.serviceWorker.register('/sw.js').then(function(registration) {
    // Registration was successful
    console.log('ServiceWorker registration successful with scope: ',    registration.scope);
    registration.pushManager.subscribe({
      userVisibleOnly: true
    }).then(function(sub) {
      console.log('endpoint:', sub.endpoint);
    }).catch(function(e) {

    });
  }).catch(function(err) {
    // registration failed :(
    console.log('ServiceWorker registration failed: ', err);
  });
}

的manifest.json：

{
  "name": "APPNAME",
  "gcm_sender_id": "SENDERID"
}

cURL请求：

curl --header "Authorization: key=APIKEY" -application/json" https://fcm.googleapis.com/fcm/send -d "{\"registration_ids\":[\"REGISTRATIONID\"],\"notification\":{\"title\":\"test\",\"body\":\"testing\"},\"data\":{\"title\":\"erse\"}}"

来自sw.js的推送事件的控制台日志：

我没有收到我在请求中发送的任何数据。这是用firebase做的其他方式吗？提前谢谢。

Answer 1

根据this，您可以向Chrome版本50发送镀铬通知版本的数据。

在Chrome 50之前，推送消息不能包含任何有效负载数据。当你的服务工作者触发'push'事件时，你所知道的只是服务器试图告诉你一些事情，而不是它可能是什么。然后，您必须向服务器发出跟进请求，并获取要显示的通知的详细信息，这可能会在网络状况不佳时失败。

现在，在Chrome 50（以及桌面上当前版本的Firefox）中，您可以随推送一些任意数据，以便客户端可以避免发出额外请求。然而，强大的功能带来了巨大的责任，因此所有有效载荷数据都必须加密。

对于您当前的实现，您可以执行以下操作：

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

var apiPath = '<apiPath>';
event.waitUntil(registration.pushManager.getSubscription().then(function (subscription){

    return fetch(apiPath).then(function(response){
        if(response.status !== 200){
            throw new Error();
        }

        return response.json().then(function(data){
            var title = data.title;
            var message = data.body;
            var icon = data.icon;
            var tag = data.tag;
            var url = data.url;
            return self.registration.showNotification(title,{
               body: message,
               icon: icon,
               tag: tag,
               data: url
            });
        })
    }).catch(function(err){

    })

}));
return;
});

对于可能与特定用户相关的任何特定通知，您可以在api url中传递worker的注册ID参数，并获取该特定id的通知。希望这有帮助！

Answer 2

根据this tutorial，您目前无法向GCM发送任何数据：

目前在Chrome中实施Push API的一个缺点是，您无法通过推送消息发送任何数据。不，没什么。这样做的原因是，在将来的实现中，有效载荷数据必须在服务器上发送到推送消息传递端点之前进行加密。这样，端点，无论是什么推送提供者，都将无法轻松查看推送消息的内容。这还可以防止其他漏洞，例如HTTPS证书验证不当以及服务器和推送提供程序之间的中间人攻击。但是，目前还不支持此加密，因此在此期间您需要执行提取以获取填充通知所需的信息。

如何使用带有FCM的服务工作者进行推送通知

2 个答案: