I’m working on a PWA (primarily targeting Android) that receives push notifications via its service worker and the browser. This works as intended, but it plays the system’s default notification sound, and I’d like to play other sounds, or at the very least allow the user to set their own notification sounds somehow.

I first checked the service worker docs and saw that, at one point, there was a sound parameter for the showNotification function in ServiceWorkerRegistration, but no browser actually supported it and it was since removed, so that’s apparently out. Playing a sound via Audio obviously isn’t an option either, because it needs to work without the browser being active and without a DOM present when receiving a push notification while the app is closed.

At this point I kind of gave up on playing my own push sounds, as I couldn’t find any other options online. I’d still very much like to do this though, in case anyone has any ideas, workarounds, or hacks, to accomplish this within a progressive web app.

My final idea was to install the PWA and set the “app’s” notification sound, which at least on Android is an option. However, even when I change the sound in the app’s notification settings, I still get the default sound. I’m not sure if this is a bug with Chrome on Android or if maybe it’s intended to work and you’re not supposed to be able to do this. Either way, this seems to be a dead end as well.

With this I come to you, hoping to find some way to accomplish custom push notification sounds in a PWA, even if the user has to set them up manually. I’m aware that another option is a wrapper like Capacitor, to bridge the native gap and hopefully allow custom sounds, but I’d prefer to stick with a PWA for now.

I’d appreciate any tips, assuming there are options I haven’t considered.