Geek Answers Handbook

Inconsistent search in HTML5 Audio player

I want to play a sound starting at a specific timestamp. But I canโ€™t even get the simplest example to work correctly. I tried the following and also modified the w3school example .

<body> <audio src="skyfall.mp3" id="audio" controls preload></audio> <button onclick="play()">Play</button> </body> <script type="text/javascript"> var secs = 32; function play(){ var p = document.getElementById("audio"); p.currentTime = secs; console.log('Playing at secs: ' + secs); p.play(); } </script>

But each browser has different sounds: Chrome for Windows will be 4 seconds late, Chrome for Android seems to be in place, Mobile Safari is disabled. (Even if VLC has this problem when playing a file.) If playback starts from the beginning of the file, they remain in sync.

So, it seems to me that the HTML5 audio standard is either improperly implemented or poorly explained.

I read that server-side is sometimes to blame, but I'm not sure how this will be a problem when reading local files. Ultimately, I want this work to work on a project in Cordoba.

Any ideas?

+3
javascript html5 cordova audio
source share
2 answers

The problem is with file encoding. For MP3 files, only a constant search for bit rate works correctly / sequentially in all browsers. W3 says MP3 is the only format officially supported by all browsers, so I believe that using CBR MP3 is the answer. However, Mozilla has a more detailed format support guide .

When the bit rate is not constant, browsers look for different segments of the audio signal with the same time stamp. The search algorithm is simple for a constant bit rate, but more complex for a variable bit rate (and often involves some form of estimation); I could not find the definition of this operation in the HTML standard, so it is not surprising that different browsers implement this differently.

There are some more discussions and possible workarounds in this answer .

0
source share

I met the same problem and I solved it by converting my MP3 file to CBR (constant bit) format. Then it can solve the inconsistent problem between currentTime and real sound .

Choose CBR format

Steps:

  • Download and install "Audacity" (free for any platform).
  • Open the MP3 file
  • Press [File] โ†’ [Export] โ†’ [Options] โ†’ [Constant] (See: Converting MP3 to a constant data rate )
  • Audacity will ask you to provide a LAME MP3 encoder (See: [Download and install LAME MP3 encoder])

There will be no inconsistent / asynchronous problem.

See also:

  • HTML5 audio starts from the wrong position in Firefox
  • Inconsistent search in HTML5 player

TJ_Tsai/tsungjung411@gmail.com

+3
source share

More articles:


All Articles