Audio stopped working randomly after 1.55.4

Help & Support
1

I have hundreds of projects in playcanvas that have audio.
Now you guys removed 1.55.4, the audio plays only randomly in 1.56 and 1.57

Will you guys ever fix this? Is there a work around?

2

You can use an older stable engine via this method Using a Custom Engine | Learn PlayCanvas

There has been one report of this in the forums but we’ve been unable to reproduce.

Can you please provide a small public project that has the issue for you and we can see if we can reproduce on our team

3

https://launch.playcanvas.com/1559918?debug=true
When you click on Start, it’s supposed to play the music but so far, almost never plays, the previous engine had no issue with this.

4

Plays fine for me here on Mac and Chrome

5

On Safari the music doesn’t play after pressing start, but if you switch to another tab and then back to the launch tab - it does start playing.

On Chrome the music played but after a while I got it into the same state as Safari and then switching tabs and back again reenabled the audio.

I noticed that after clicking the start button there are console errors related to ‘enableFullscreen / requestFullscreen’ in both Mac Chrome and Safari. I wonder if its related.

1 Like
6

Looks like it’s related to the full screen API that is being used is deprecated.

image
image2668×1178 394 KB

And that error/exception is blocking the audio playback in the engine

Please use the browser direct API Element.requestFullscreen() - Web APIs | MDN

1 Like
7

You can check this forum post as well. This problem also happened to me. The solution is to play an audio on the loading screen. Modify the showStart method on the loading screen. Have a button to start the experience, and do this:

var showStart = function () {

        const game = document.getElementById('application-canvas');

        game.style.display = 'none';//hide game - game is only supposed to be interactable after tapping on the start button on this loading screen. Found no other way to prevent interaction with PlayCanvas other than this. None of the other solutions like [pointer-events](https://stackoverflow.com/questions/33264310/in-html-can-i-disable-user-interaction-with-an-entire-dom-sub-tree) and whatnot worked.

        const startBtn = document.getElementById('startBtn');//get the start button on the DOM

        startBtn.classList.add("fadeIn");//just a [css transition](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Transitions/Using_CSS_transitions) to fade in the button

       

        btnSound = new Audio();

        btnSound.src = app.assets.find("Button.mp3").getFileUrl();//get button click audio

        startBtn.onpointerup = function() {

            var splash = document.getElementById('application-splash-wrapper');

            splash.parentElement.removeChild(splash);

            btnSound.play();//play the button sound. This is the important part for Safari, playing it on a button click. At this point, all other sounds are unlocked for Safari. You shouldn't have issues playing them after this.

            setTimeout(() => {

                game.style.display = '';//make game interactable again

            }, 100);//small delay is necessary, otherwise unwanted interaction might still happen.

        };

    };

Definitely a regression, at some point this code wasn’t necessary, now it is though. Trying to play the sound on a button click in PlayCanvas itself doesn’t work if you don’t unlock the sound on the loading screen first. This is only for iOS Safari though ;). Hope it helps!

1 Like