CODEWITHSUNDEEP
javascripthtmlaudio
Big Money
Big Money

Reputation: 10068

Media resource http://url/audio/file.mp3 could not be decoded sometimes

So I have multiple audio files, some in .ogg some in .mp3.

I have a variable

var music = [new Audio("audio/song1.mp3"), new Audio("audio/song2.mp3"), new Audio("audio/song3.mp3"), new Audio("audio/song4.mp3"), new Audio("audio/song5.mp3"), new Audio("audio/song6.mp3"), new Audio("audio/song7.ogg") ];

I cycle through the songs, and sometimes they load and play just fine, and other times they get the error Media resource http://url/audio/file.mp3 could not be decoded.

Every song has worked at some point, and every song has not worked at some point. On average, .5 songs aren't decoded and don't play each refresh of the page (restarting the server seems to have no effect). Minimum of 0 songs aren't decoded, and have had a maximum of 3 songs that aren't decoded.

I'm looping through the array and calling load() on each Audio, and then calling pause() on the current running one, and play() on the next. I get the error on play().

Same behavior in both Firefox and Chrome.

Any ideas?

Upvotes: 1

Views: 2502

Answers (2)

Komla
Komla

Reputation: 91

Based on my research, it seemed that this error was occurring because the .play() method was being called before the media was fully loaded. I was able to resolve the problem using this approach:

  1. Define the audio object
  2. Define the source for the media file
  3. Set the "onloadeddata" event to start playing the media file when the loading of the file has been completed

  4. Call the .load() method to load the media file

    var myAudioObj = new Audio();

    //or myAudioObj = document.getElementById("myAudioDiv");

    myAudioObj.src = "http://urltomymediafile";

    myAudioObj.onloadeddata = myAudioObj.play;

    myAudioObj.load();

By using this approach the media file can then start playing after it has been fully loaded. You can also try using the "oncanplay" event which occurs when the browser has loaded enough of the file in order to start playing.

Upvotes: 0

jalbam
jalbam

Reputation: 356

I faced the same problem when I tried to create and/or play many Audio objects in the same web site. Specially in the Firefox. My computer (which has Apache installed to serve the web sites and also the audio files) has just 2 GB of RAM.

The audio files are ok and play nicely with the browser in the beginning. But it seems there is a problem with the memory and somehow when a point is reached, the browser just throw that error and will not decode any Audio object unless you let it some time to breath and recover its memory. To increase the number of Audio files you can create/play before it fails, you can add some time between one "new Audio(...)" (and/or the call to the play() method) and another. But that trick is just for adding/playing some files more as you will still have the same problem at some point later when you reach a certain number of Audio objects created/playing.

At least in Firefox, you can improve this situation if you stick with just data URIs instead of real file paths. This should let you create/play many more Audio objects. But I don't like this solution because not all browsers support data URIs.

If anyone has a better solution, I will be glad to hear it. I am also waiting for a better answer since I have the same problem and I could not find any solution all over the Internet.

Upvotes: 2

Related Questions