HTML5 mp3 issues in Opera

Hey all!

I just realized that one of my projects doesn’t work in Opera - while there
are no problems in IE, Chrome, Safari & FireFox.
It contains audio in .mp3 format and got stuck right at the preloader, spitting
out the following error on the console:
Uncaught (in promise) DOMException: Unable to decode audio data

Edit:
Okay, obviously Opera generally doesn’t like .mp3 sounds because simply
dragging a .mp3 file onto it fails too.
I know that .ogg audio might be an alternative though it also isn’t supported
by all browsers.
Is there a way I could include some conditional logic? e.g. if the browser
is Opera use .ogg, if Internet Explorer use .mp3, .wav or whatever?

Yes, include the same audio file in multiple extensions, and the tools will treat them as one file on the HTML5 target, so put “Assets/sound.ogg” next to “Assets/sound.mp3” or “Assets/sound.wav” :slight_smile:

I’m using Opera and I can tell you that mp3 works! (dragging file and also my openfl projects with only mp3).

What version of Opera are you using?

Hey singmajesty & loudo!

Thanks to both of you!
Actually I just setup a fresh Win 7 & Opera portable v44
and dragging a .mp3 onto it actually works. Don’t know what
was wrong yesterday because it was the same Opera.
My problem still persists though!
Simply putting multiple formats of the same sound didn’t
help singmajesty. It’s still stuck at the preloader:

Uncaught (in promise) DOMException: Unable to decode audio data
"[lime.app.Preloader] ERROR: Error loading asset “sounds/sound3.mp3"”
"Error: [lime.app.Preloader] ERROR: Error loading asset "sounds/sound3.mp3"
at Function.lime_utils_Log.error (http://localhost:2000/newopen.js:20176:40)
at http://localhost:2000/newopen.js:8056:21
at lime_app_Promise.error (http://localhost:2000/newopen.js:8176:6)
at lime_utils_AssetLibrary.load_onError (http://localhost:2000/newopen.js:19493:140)
at f (http://localhost:2000/newopen.js:42158:242)
at http://localhost:2000/newopen.js:19316:8
at lime_app_Promise.error (http://localhost:2000/newopen.js:8176:6)
at t. (http://localhost:2000/newopen.js:16774:12)
at t. (http://localhost:2000/lib/howler.min.js:2:16250)"
"[lime.app.Preloader] ERROR: Error loading asset “sounds/sound3.mp3"”

project.xml is set up like this:

<assets path="assets/sounds" rename="sounds" include="*.ogg|*.mp3" unless="flash" />

At the moment I’m referencing a sound like this:
sndCorrect = Assets.getSound(“sounds/sound3.mp3”);

Which of course doesn’t work in Opera because I would need the .ogg extension
but even if I don’t reference a sound at all - just a blank project containing
the sounds in assets/sounds I get the above error!
What could be wrong and what could I do about the browser-based fileextension in
the getSound function?

A similar issue was recently affecting Internet Explorer when the preloading of assets reaches an .OGG file (i’ve not tested with the most recent point releases yet ) HTML sound woes, after Howler replaces SoundJS

Current versions should preload the file set (which allows Howler to pick what extension it wants) rather than forcing each file to load

I can confirm that I’m using OpenFL 4.9.2 & Lime 4.0.3.
Maybe you have a working example I could check out?

hummm, I’m on OpenFL 4.9.2 & Lime 4.0.3 also.
html project running correctly on Opera (it loads the .ogg files)
but failing in Internet Explorer , with the error

SCRIPT5022: Error: [lime.app.Preloader] ERROR: Error loading asset "soundassets/bonk1.ogg"

I’m including the .ogg files within the project, and copying the .mp3 equivalent files to the same directory as the .ogg .
If i delete all of the .ogg , IE is giving the same error, (and not using the .mp3 equivalent files)

are you doing this the same way @obscure ?

Are you copying the MP3 and OGG to the same asset directories (and allowing the tools to copy), or are you copying directly to the output folder?

The tools will need both files included as assets in order to know that you have both versions

@Penry

Yeah same happens over here. Actually I switched to .mp3 back then
because .ogg didn’t work in Internet Explorer -> it got stuck at the
preloader, moaning it couldn’t load the asset xxx.ogg
Now the exact same thing happens with Opera though it’s because of
.mp3 files this time.

@singmajesty

The .mp3s and .oggs are all in the same asset directory, yeah.

<assets path="assets/sounds" rename="sounds" include="*.ogg|*.mp3" />

Here’s a simple test project: Link

What could possibly be wrong? Let me put my head above the parapet - do we need a specific Haxe
version?

Good news fellows! OpenFL ain’t the culprit - though I never
dared to blame OpenFL. :wink:
It’s Opera itself! Some versions support .mp3 playback, some
others don’t as pointed out by the developer of howler: https://github.com/goldfire/howler.js/issues/481#issuecomment-201912133

Because of this he added the following line of code to howler which checks
if the browser is Opera and if it’s version <33.

var isOldOpera = (checkOpera && parseInt(checkOpera[0].split('/')[1], 10) < 33);

If I set it to some ridiculous high value like 66 instead of 33 it falls
back to .ogg and my sound plays just fine. By my own experiences I can say Opera
is real strange. I set up two virtual machines running Windows 7, installed the same Opera
version on both and dragging a .mp3 onto it just worked in one.
A question remains though: If I add .ogg and .mp3 files to my project and
howler decides which format it picks how to I reference a particular sound?
sndCorrect = Assets.getSound(“sounds/sound3.mp3”);
won’t help since I’m specifically requesting a .mp3.

I believe Opera works fine outside a virtual machine. MP3 falls under a special category where it attempts to use the host system’s decoder (I believe) in order to bypass license concerns.

You should not have to worry about the getSound call using OGG or MP3, we combine both formats into the same call to Howler. However, I’m not sure if Howler prefers a specific file extension or if it prefers based on the order in which we feed the file names. If it cares about the order, then perhaps we should evaluate which order we provide

Whoops - this is a little embarrassing! You’re absolutely right! It works
flawlessly outside a virtual machine. Thanks for pointing out. :slight_smile:
I tend to do some development inside virtual machines so I don’t clutter my real
systems and something like this didn’t happen yet. Learning never stops.