What audio method works across all web browsers and mobile for HTML5/JavaScript?

Question

I have looked at a number of ways to trigger audio in HTML5/JavaScript, but each time I find something that might be workable, I find web browsers and mobile devices it doesn't work on at all.

What is considered the best method that works across all web browsers and mobile for creating a game with sound using HTML5/JavaScript?

What do experienced interactive game programmers do? Do you check the user's web browser or mobile device and serve up different code to make it work? Or do you have a single solution for this? Or do you warn the user by supplying a list of web browsers and mobile devices the software is known to work with?

Additional Information: I found out that audio in some web browsers, like Safari on the Mac, it will load the audio file each time it is triggered, which causes a problem. I saw once solution using what is called Audio Sprites: https://phaser.io/examples/v2/audio/audio-sprite This way, you load one audio containing all your sounds needed, and then you pass a pointer to where in the audio file to start playing the sound and where to stop. That sounded like a solution, but this doesn't work on the Safari web browser, it produces no sound at all.

Then I looked into Web Audio API, and this is impressive: https://forestmist.org/share/web-audio-api-demo

While this worked on the Mac for Safari, Firefox and Google Chrome, and the iPhone, it doesn't work on Windows with Internet Explorer (or Safari on Windows either).

I've not tested Web Audio API on the android phone yet, because I don't have access to one at the moment. So I was wondering what experienced interactive programmers do to provide audio to work across most or all platforms? It seems a huge step-backwards to have to alert visitors to a website that they can only use the functions on it by using a short list of web browsers.

The issues as I see it seem to have to do with being able to load the audio file and not have it re-loaded over the internet each time it is referred as play(). I realize Web Audio API might provide much more capability than most of us needs, but is that the current gold-standard for audio in a HTML5/JavaScript game?

Here is a simple example, using audio that works on Google Chrome/Mac, but it doesn't work on Safari/Mac: https://rawgit.com/mehaase/js-typewriter/master/example3-typewriter/index.html

Answer 1

Disappointing Answer:

If you decided to build something based on modern tools (HTML5/CSS3/JS6), then you should ignore browsers that don't support such features (like the Audio API), otherwise you will spend most of your time debugging and doing some dirty workarounds rather than developing. By the time you successfully made all the hacks to support these browsers, they'll probably be supporting these features.

Additional Notes:

caniuse.com is a good source to see what's supported and what's not as @Coburn said.