浏览器中的音频播放器如何工作?

时间:2016-03-11 06:32:25

标签: javascript http audio-streaming internet-radio

我已经进行了一段时间的Javascript编程,但它总是与数据更新,保存,操作等有关。

我不知道像浏览器中的音频播放器是如何从互联网上获取音频(特别是直播,流媒体音频)并从我的电脑扬声器中播放出来的。

这在Javascript中是如何发生的?

例如,网站如何使用Javascript为我的扬声器提供实时音频? http://player.streamtheworld.com/liveplayer.php?callsign=WVIEAM

1 个答案:

答案 0 :(得分:1)

现场音频与预先录制的音频没有太大差别......它只是在接收时播放,而在现场播放时,它会在录制时进行编码。

在浏览器中,最流行的音频形式是一个简单的<audio>标签。通过将src属性从文件更改为流,您已启动并运行:

<audio src="http://cdn.audiopump.co/waug/main_mp3_256k" />

在这种情况下,浏览器不知道或不关心音频是直播。它所知道的是,它有一些媒体数据通过HTTP获取,并在它进入时播放。

如果您的浏览器兼容性良好,最好使用MediaSource API,从而为您提供更多控制权(例如切换到不同质量的流,如HLS中所示)并确保浏览器不会尝试缓存实际上是一个无限大小的文件。

  

例如,网站如何使用Javascript为我的扬声器提供实时音频? http://player.streamtheworld.com/liveplayer.php?callsign=WVIEAM

这个特定网站由Triton Digital运营,他们仍然使用Flash。从HTML5音频未得到广泛支持的时代开始,许多网站仍然保留这一功能。今天几乎没有理由这样做。

使用Flash的其他原因包括不兼容的服务器协议。如果您的流媒体服务器使用的是RTMP,那么您将无法使用Flash,因为浏览器不会使用RTMP。

由于浏览器无法正确处理包含在ADTS中的AAC,因此在浏览器中流式传输AAC时出现了问题。 (在大多数情况下,这种封装是流式AAC所必需的。)大多数浏览器已经解决了这个问题,但我怀疑这就是Triton Digital仍在使用他们的Flash解决方案的原因。通过使用Flash,他们可以播放AAC / ADTS流。