[FIXED] What are the requirements for audio output in Chrome on Android?

Issue

I'm using code from here: https://github.com/TwilioDevEd/video-quickstart-php to develop a webRTC web app.

The example application, when running successfully on 2 browsers, creates the following HTML:

  <div id="remote-media">
  <audio src="blob:https%3A//myAddress.com/8a537e34-9ab2-4bea-a85d-61e5f80b585c"></audio>
  <video src="blob:https%3A//myAddress.com/22b23b46-9021-4f15-9ab5-ffb78fec2d48"></video>
  </div>
  
  <div id="local-media">
  <audio src="blob:https%3A//myAddress.com/740c8e33-cc60-4d1e-b1fe-2c23742e618d"></audio>
  <video src="blob:https%3A//myAddress.com/3105d4a2-cd71-4408-8b7c-771cba677829"></video>
  </div>

It works on Chrome and Firefox on a PC, and works on Firefox on Android.

Chrome on Android connects, there is video and audio input which is visible and audible on the remote browser, and there is video output - the video streamed from the remote browser. THE PROBLEM: there is no audio output.

I have tried $("audio").autoplay="true"; in the javascript that creates the <audio> element.

I have opened other web pages from the same Chrome installation on the same device (eg. YouTube) and I have audio and video.

What am I missing?

Solution

"On iOS, and Chrome for Android, autoplay doesn’t work; users must tap the screen to play the video." source: https://developers.google.com/web/fundamentals/design-and-ui/media/video/quick-reference?hl=en#autoplay

My solution:

      <button id="audioOn" onclick="$('#remote-media > audio')[0].play()">Cant hear? Click me!</button>

Answered By - grateful

Answer Checked By - David Goodson (PHPFixing Volunteer)