Question

0

49

Views

Cannot get HTML audio element to play on Chrome Android (no progress unless muted)

I'm posting this in case others have a similar problem.

I have a web app that uses the <audio> element. When the user clicks a button, I set the src attribute on the <audio> element to a URL of a mp3 file, then I call .load() and then .play(). The play() method's Promise resolves properly.

On the web, this works, I hear the music. On Android Chrome, the audio did not play:

The Play/Pause control showed the Pause icon (indicating the audio element thinks it's playing).
The progress on the track stayed frozen at the beginning 0:00.
If I muted the element, the track started playing.
If I just browsed to the URL of the mp3 file in Chrome, the audio loaded and I could play the song.

Anybody out there know why?

about 1 month ago ·

Juan Pablo Isaza

1 answers

Answer question

0

Answer question

Find remote jobs

Loading

Answer 1 · 2022-07-03T11:01:35.400Z

After a bunch of playing around and debugging, on a whim I finally removed some code I had planned to experiment with around audio context / graph:

const audioCtx = new AudioContext();
const sourceNode = audioCtx.createMediaElementSource(this.audioElem);

After remove these lines - the <audio> element played properly!