Question

希望有人可以帮我解决这个问题。

我正在玩一个node.js服务器，它将音频流传输到客户端，我想创建一个HTML5播放器。现在，我正在使用分块编码从节点流式传输代码，如果直接转到URL，它的效果很好。

我想要做的是使用HTML5 <audio>标记嵌入此标记，如下所示：

<audio src="http://server/stream?file=123">

其中/stream是节点服务器流式传输MP3的端点。 HTML5播放器在Safari和Chrome中运行良好，但它不允许我寻找，Safari甚至称它是“直播”。在/stream的标题中，我包含文件大小和文件类型，并且响应正常结束。

有关如何解决这个问题的任何想法？我当然可以立即发送整个文件，但是玩家会等到整个文件被下载 - 我会把它流传输。

Answer 1

确保服务器接受范围请求，您可以检查标头中是否有Accept-Ranges。在jPlayer中，当涉及到进步和寻求功能时，这是Webkit（特别是Chrome）浏览器中的常见问题。

您可能没有使用jPlayer，但官方网站上的服务器响应信息可能有用。

http://www.jplayer.org/latest/developer-guide/#jPlayer-server-response

Answer 2

看看这里http://www.scottandrew.com/pub/html5audioplayer/，我用它并在下载文件时播放。它等待缓冲区然后播放。从来没有试过尝试，但我会先尝试在他的代码中设置“aud.currentTime”，如果可以的话。

祝你好运

Answer 3

您是否发送了Accept-Ranges（RFC 2616, Section 14.5)响应标题？

Answer 4

但我遇到了同样的问题。必须为媒体文件响应设置一些标题。

例如：

Accept-Ranges:bytes
Content-Length:7437847
Content-Range:bytes 0-7437846/7437847

然后音频标签将能够寻找

Answer 5

根据我的理解，您希望播放器允许用户跳转到尚未缓冲的部分音频/视频，类似于Vimeo / YouTube播放器所做的事情.Tbh我不确定这是不是可能，因为我看了一些html5内侧元素的例子，他们只是不允许我寻找无缓冲的部分：（

如果你想通过缓冲部分寻找 - 那么这不是问题。事实上 - 就我所知，你在这里为自己创造了一个问题。您想要流式传输文件，这样做会让玩家认为您有某种直播流。如果您只是直接发送文件 - 您就不会遇到此问题，因为播放器可以在加载整个文件之前开始播放。这适用于音频和视频元素，我已经在Chrome和FF中确认了这种行为：）

希望这有帮助！

Answer 6

也许这个html5 audio player example将解释并向我们展示新元素及其.load，.play，.currentTime等方法。

我使用一个元素数组，当然可以设置currentTime位置。我们也可以使用事件处理程序（例如'loadeddata'）在允许搜索之前等待。

ping并享受html5的乐趣：）

使用HTML5 <audio>标记</audio>查找流式MP3文件

6 个答案: