Question

我正在使用Angular和NodeJ进行Web推送通知。在Node.js中，我正在使用Web-push npm软件包，而Angular使用了来自Service Worker的SwPush类。除了从后端通知图标收到未显示的推送通知时，其他所有内容似乎都正常运行。

使用swpush接收通知：

swPush.messages.subscribe(
      (notification: any) => {
        console.log("received push message", notification);

        let options = {
          body: notification.body,
          icon: "http://localhost:3000/assets/img/logo.png",
          badge: "http://localhost:3000/assets/img/logo.png",
          image:"http://localhost:3000/assets/img/logo.png",
          actions: <any>notification.actions,
          data: notification.data,
          vibrate: [100, 50, 10, 20, 20],
        };
        this.showNotificationss(notification.title, options)
      },

      err => {
        console.error(err);
      }
    );

用于显示通知的通知功能：

  showNotificationss(title: string, options: NotificationOptions) {
    navigator.serviceWorker.getRegistration().then(reg => {
      reg.showNotification(title, options).then(res => {
        console.log("showed notification", res)
      }, err => {
        console.error(err)
      });
    });
    }

NodeJs路由器将通知发送给客户端：

app.post('/subscribe', (req, res) => {
  const subscription = req.body;
  res.status(201).json({});
  const payload = JSON.stringify({ title: 'test',  icon: "http://localhost:3000/assets/img/logo.png",
          badge: "http://localhost:3000/assets/img/logo.png", });
  webpush.sendNotification(subscription, payload).catch(error => {
    console.error(error.stack);
  });
});

这是我现在收到的通知。它将始终显示chrome图标，而不是我刚才提到的图标。

shortcut

我尝试了所有操作，但通知图标未更改，始终显示chrome图标。我怎样才能解决这个问题？预先感谢。

Web推送通知Angular中未显示图标

0 个答案: