切换 SHOUTcast 音频流 HTML5 音频播放器和 JQuery答案

【问题标题】：switching SHOUTcast audio streams HTML5 audio player and JQuery切换 SHOUTcast 音频流 HTML5 音频播放器和 JQuery
【发布时间】：2014-06-30 22:34:45
【问题描述】：

您好，我将在下面粘贴所有内容，但发生的情况是它正在使用正确的 url 更新页面，但如果我按下“lo”，它只会播放“hi”流（随浏览器加载），它会停止音频但不会't play 并单击“hi”然后再次启动 hi 流并正常播放，这样做也很明显，因为当按下 lo 流时，播放时间滑块位于开头并显示 0；当它与 hi 一起工作时，它在最后并计数：

所以 $(document).ready 函数是：

                var audio = $('#audioPlayer');
            $('#hi').on("click", function () {
                audio.attr("src", "http://96.31.83.94:8061/;");
                /****************/
                audio[0].pause();
                audio[0].load();//suspends and restores all audio element
                audio[0].play();
                /****************/
                });

            $('#lo').on("click", function () {
                audio.attr("src", "http://85.17.167.136:8534/;");
                /****************/
                audio[0].pause();
                audio[0].load();//suspends and restores all audio element
                audio[0].play();
                /****************/
                });

播放器和按钮：

        <div id="audioPanel" class="col-md-12">
        <div class="col-md-4 col-md-offset-4">
            <audio id="audioPlayer" class="audioPlayer" src="http://96.31.83.94:8061/;" controls autoplay>
                Your browser does not support the audio element.
            </audio><br>
            <div id="streamButtons" class="btn-group">
                <button id="lo" class="btn btn-primary btn-xs">Lo</button>
                <button id="hi" class="btn btn-primary btn-xs">Hi</button>
            </div>
        </div>

如果按下按钮后按 F5，查看源代码不会改变，但在萤火虫和检查元素中，它确实会更改为正确的“lo”网址，但由于某种原因无法播放...请帮助。

这显然不是 doc.ready 中唯一的内容，而是列表中的第一个。

编辑：这是启动 lo 按钮后的播放器

   <div id="audioPanel" class="col-md-12">
<div class="col-md-4 col-md-offset-4">
<audio id="audioPlayer" class="audioPlayer" autoplay="" controls="" src="http://85.17.167.136:8534/;"> Your browser does not support the audio element. </audio>
<br>
    <div id="streamButtons" class="btn-group">
<button id="lo" class="btn btn-primary btn-xs">Lo</button>
<button id="hi" class="btn btn-primary btn-xs">Hi</button>
</div>

【问题讨论】：

标签： jquery html audio shoutcast

【解决方案1】：

您的代码工作正常，除了源代码为 85.17.167.136:8534 的那个的广播不起作用，因为它的内容类型是音频/aacp，它周围有 ADTS 包装器，如下布拉德所述，不是在 HTML5 播放器中支持。所以我建议您搜索音频/mpeg 内容，否则您将需要一个 Flash 播放器来播放该流。

欲了解更多信息，请查看：Is it possible to play this stream using HTML5/javascript?

【讨论】：

就是这样...不是代码，而是 aac 问题。谢谢你发现。它永远不会在任何带有 html5 播放器的设备上播放，因此我的解决方案必须是以其他方式加载它或扩展可用的更高流的数量。欢呼
具体来说，并不是不支持 AAC，而是围绕它的 ADTS 包装器。许多浏览器都可以很好地播放 AAC，但它必须位于难以流式传输的 MP4/M4A 容器中。在我看来，这是浏览器开发人员的重大疏忽，您可以在开发邮件列表中看到他们对这个问题的争论。