i dont want to show message onbackground because crashing with hundreds notification.

[yogithesymbian]

i have a problem with a lot of notification that make crash other computer !.
in one day we have more than 120 notification.

i have implemented on vue2.
what i expected is i can listening on new incoming notification that trigger on .vue , now its work .
what i expected is i can disable notification onbackground by browser(chrome/mozila)

my unExpected is my apps or browser still get notification by chrome/mozila browser

i have clear data/cache to get a new service worker or cookies or cache or other.

when i deleted the firebase-messaging-sw.js its cant listening any message, its throw about service worker not found 'because i deleted' then why i deleted it ?

here is description.
my project/public/firebase-messaging-sw.js

// Give the service worker access to Firebase Messaging.
// Note that you can only use Firebase Messaging here. Other Firebase libraries
// are not available in the service worker.
importScripts('https://www.gstatic.com/firebasejs/8.2.5/firebase-app.js')
importScripts('https://www.gstatic.com/firebasejs/8.2.5/firebase-messaging.js')

// Initialize the Firebase app in the service worker by passing in
// your app's Firebase config object.
// https://firebase.google.com/docs/web/setup#config-object
firebase.initializeApp({
  apiKey: 'x',
  authDomain: 'project-x.firebaseapp.com',
  databaseURL: 'https://project-x.firebaseio.com',
  projectId: 'project-x',
  storageBucket: 'project-x.appspot.com',
  messagingSenderId: 'x',
  appId: '1:x:web:x',
  measurementId: 'G-x',
})

let messaging = null
if (firebase.messaging.isSupported()) {
  messaging = firebase.messaging()
  messaging.onBackgroundMessage(payload => {
    console.log(
      '[firebase-messaging-sw.js] Received background message ',
      payload,
    )
    const notificationTitle = payload.notification.title
    const notificationOptions = {
      body: payload.notification.body,
      icon: './logo.png', // This will only work when the webpage is opened. If you always want to show an image you should fetch it via URL.
      vibrate: [200, 100, 200, 100, 200, 100, 200],
      // tag: 'custom-notification',
      badge: './favicon.ico',
      tag: 'tes',
      renotify: true,
      data: {
        url: payload.data['gcm.notification.url'],
      },
    }
    console.log(
      '[firebase-messaging-sw.js] Received background message (disable-by-administrators)',
      notificationOptions,
    )
    console.log('title: ', notificationTitle)
  })
} else {
  console.log(
    '[firebase-messaging-sw.js] doesnt support with this browser',
  )
}

but why i still get notification on background by chrome ??? i didnt put showNotification

i didnt put any code to trigger , what i know ,,, we must put some code look like these to trigger

// Schedule closing all notifications that are not our own.
    // This is necessary because if we don't close the other notifications the
    // default one will appear and we will have duplicate notifications.
    // return new Promise(((resolve, reject) => {
    //   resolve()
    //   setTimeout(() => {
    //     self.registration.getNotifications().then(notifications => {
    //       notifications.forEach(notification => {
    //         if (notification.tag !== 'landline-monitoring') {
    //           notification.close()
    //         }
    //       })
    //     })
    //   }, 30)
    // }))

or

// setTimeout(() => {
    // self.registration.showNotification(
    //   notificationTitle,
    //   notificationOptions,
    // )
    // }, 30)

or

// self.addEventListener('notificationclick', event => {
  //   event.notification.close()
  //   const promise = new Promise((resolve => {
  //     setTimeout(resolve, 500)
  //   })).then(() => clients.openWindow(event.notification.data))
  //   event.waitUntil(promise)
  // })
  self.addEventListener('notificationclick', event => {
    const { url } = event.notification.data
    event.notification.close() // Android needs explicit close.
    event.waitUntil(
      clients.matchAll({ type: 'window' }).then(windowClients => {
        // Check if there is already a window/tab open with the target URL
        for (let i = 0; i < windowClients.length; i++) {
          const client = windowClients[i]
          // If so, just focus it.
          if (client.url === url && 'focus' in client) {
            client.postMessage('reload')
            return client.focus()
          }
        }
        // If not, then open the target URL in a new window/tab.
        if (clients.openWindow) {
          return clients.openWindow(url)
        }
      }),
    )
  })