How to play notification sound on website since google autoplay policy change

user_7852939 0
Viewed 1814

I've been trying to short beep for a notification on website but google autoplay policy change does not allow me to do so what should I do. I've seen so many sites still doing this like facebook chat etc.

I've tried this with no success (also tried with element):

function beep(vol, freq, duration){
v=a.createOscillator()
u=a.createGain()
v.connect(u)
v.frequency.value=freq
v.type="square"
u.connect(a.destination)
u.gain.value=vol*0.01
v.start(a.currentTime)
v.stop(a.currentTime+duration*0.001);
}
beep(vol, freq, duration);
autoplay beep audio notifications javascript
2 Answers

The problem is that autoplay sound will be blocked under some circumstance according to the autoplay policy of Chrome.

Autoplay with sound is allowed if:

  • User has interacted with the domain (click, tap, etc.).
  • On desktop, the user's Media Engagement Index threshold has been crossed, meaning the user has previously played video with sound.
  • The user has added the site to their home screen on mobile or installed the PWA on desktop.
  • Top frames can delegate autoplay permission to their iframes to allow autoplay with sound.

See https://developers.google.com/web/updates/2017/09/autoplay-policy-changes#webaudio for more details.

user_54560710

You can use the below code but Sound must be set to Allow in Notification settings for that website e.g localhost:8000 in Google Chrome settings

 let audio = new Audio("../../assets/sound/quite-impressed.wav");
  audio.play();
user_20994370
Related