Autoplaying in a non-autoplay Chrome world.

Autoplaying media in a non-autoplay Chrome world.

With the release of the autoplay policies from Google, it became darn hard to play sounds without at least the user/client interacting with your document first. Not all sounds fall in the domain of “interact first” per se. Sounds like notifications may or may not need an initial interaction and this is where things can indeed get a tad tricky.

However, chrome provides a bunch of conditions for which one can play sounds. The one that stuck out had to do with with setting autoplay attributes to an iframe so the approach to this, albeit a hacky one, has you applying an iframe whenever you want to play sounds. In addition to this, you can use the `HTMLAudioElement` to also achieve playing sounds AFTER adding the iframe but thats not the purpose of this text. Here we want to achieve this all via code only. The solution looks something like…

As you can see…we are simply appending a hidden iframe to the body which plays sounds without needing the client to interact with the browser first and with this, you can achieve some autoplay implementation which are good for notifications.