Geek Answers Handbook

Streaming audio with the html5 tag `<audio>`

I am trying to transfer audio to a site hosted by Dreamhost from a series of lectures using the <audio> in html5, but without much success. Actual code

 <audio id="playerTwo" class="player" controls="controls" preload="none"> <source src="audio.ogg" type="audio/ogg; codecs='vorbis'"/> <source src="audio.mp3" type="audio/mpeg"/> </audio>

I also have a .htaccess file to enable the correct mime types for apache.

AddType audio / ogg.ogg

AddType audio / mpeg.mp3

Ogg files are about 8 megabytes, and mp3 files are about 13 megabytes. Each file has been exported from Audacity.

Everything works fine in FF, Chrome and Safari when it works locally on my computer with Windows 7 (win32 version of apache 2.2.14 and php 5.3.1 works).

Dreamhost is not so good. (They start apache 2.2.15 and php 5.2.14.) FF stops playing the audio file after 5 seconds. Chrome plays an audio file, but audio is often skipped. Safari plays the sound correctly, but the gap between pressing the play button and the sound actually starting the stream and playback is about three minutes.

If, instead of the <audio> I play mp3 files from Dreamhost using the Silverlight player, they play and play correctly.

Any suggestions on what I need to do to make the <audio> work correctly. As far as I know, html5 audio is a client technology, like Silverlight. So, theoretically, Dreamhost should not affect the operation of the <audio> .

Anyway, anyone has ideas on what is wrong.

Thanks.

+7
html5 audio mp3 streaming ogg
source share
1 answer

The problem with downloading audio files through filezilla is in the ascii transfer type and not the binary transfer type. The sound files were damaged during the download, so it was not much surprise that they did not play well. Surprisingly, the MP3 files did play acceptable, although the ogg files did not.

This is the answer here.

+11
source share

More articles:


All Articles