Chrome Push Notification: This site has been updated in the background

Question

While implementing the chrome push notification, we were fetching the latest change from our server. While doing so, the service-worker is showing an extra notification with the message

This site has been updated in the background

Already tried with the suggestion posted here https://disqus.com/home/discussion/html5rocks/push_notifications_on_the_open_web/
But could not find anything useful till now. Is there any suggestion ?

Answer 1

I was expriencing the same issue but after a long research I got to know that this is because delay happen between PUSH event and self.registration.showNotification(). I only missed return keyword before self.registration.showNotification()

So you need to implement following code structure to get notification:

var APILINK = "https://xxxx.com";  self.addEventListener('push', function(event) {       event.waitUntil(           fetch(APILINK).then(function(response) {          return response.json().then(function(data) {                   console.log(data);                   var title = data.title;                   var body = data.message;                   var icon = data.image;                   var tag = 'temp-tag';                   var urlOpen = data.URL;                  return  self.registration.showNotification(title, {                       body: body,                       icon: icon,                       tag: tag                   })               });           })       );   });