角度服务工作者 - 处理推送通知点击

Sam*_*pat 6 web-push angular angular5 angular-service-worker

如何处理角度服务工作者中的推送通知单击.SWPush没有任何方法.

我已经尝试引用一个侦听"notificationclick"事件处理程序的js,但是在点击通知按钮时它从未被触发过.

任何指针都会有所帮助!

tit*_*sfx 5

我建议将 angular 至少更新到 Angular 7.1.0 版本(我建议保持最新)。有了这个,您现在可以订阅notificationClicks

在构造函数中注入SwPush然后使用它:

   this.swPush.notificationClicks.subscribe( arg =>
   {
     console.log(
       'Action: ' + arg.action,
       'Notification data: ' + arg.notification.data,
       'Notification data.url: ' + arg.notification.data.url,
       'Notification data.body: ' + arg.notification.body,
     );

  });
Run Code Online (Sandbox Code Playgroud)

如果你不想更新你应该看的文件ngsw-worker.jsWebpackgulp与线或等再后 this.scope.addEventListener('push', (event) => this.onPush(event)); 增加以下内容:

this.scope.addEventListener('notificationclick', (event) => {
    console.log('Notification event', event);
    event.notification.close();
    var payload = event.notification.data;

    if (event.action && payload.actions && payload.actions.includes(event.action) 
       clients.openWindow && event.notification.data.url) {
      event.waitUntil(clients.openWindow(event.notification.data.url));
    }
  });
Run Code Online (Sandbox Code Playgroud)