THREE.Audio don't work on iOS

Hi everyone

I’m working on a project, it is on his final steps… but testing on devices, I noticed than Audio on iOs dont work. Neither Chrome or Safari. But Android Chrome, Safari, and desktop works perfectly.

The audio contexts is created while the page load, but is resumed when the user interacts (clic on the orange screen) that make the ambient sound play, and the other sounds plays when the ball hits the scene elements.
All audio sources are in .mp3

Its kinda golf game. Here is a live example https://bbc-pong.netlify.app/

Some ideas why this is happening?

Three r134

1 Like

I’m not sure this helps but you should try to remove this warning:

The AudioContext was not allowed to start. It must be resumed (or created) after a user gesture on the page.

Like mentioned in the warning you should only access the audio context after a user interaction like a button press. Accessing the audio context happens as soon as you create instances of audio classes in three.js.

1 Like

I have two listeners. Wich mean two context.
The first control the ambient sound. The second control the sound fx, bounce, hit, etc.

I modify the code, creating the first just after the user interacts with the orange overlay. And keeps without playing the ambient sound.
Can check here, same link. https://bbc-pong.netlify.app/

Also check one of the examples and also dont work in iOs even having a ‘Play button’
https://threejs.org/examples/?q=audio#webgl_loader_mmd_audio

By other wise, check this project and it works perfectly!!! (even with the console warnings)

Reading documentation, to make video and audio work properly on iOs, the HTML Audio tag must have ‘playsinline’ and ‘muted’ atrributes. But how can I put it here?

Its very confussing. Any other idea?

Hi MrMateo07. Did you find a solution to this? I’m having the same issue. I’m using MP3 and a user gesture to initialise. Thanks!