将音频从 Node.js 服务器流式传输到 HTML5 <audio> 标签
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/3955103/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Streaming audio from a Node.js server to HTML5 <audio> tag
提问by Scott Wilson
I've been experimenting with binary streams in Node.js, and much to my amazement do actually have a working demo of taking a Shoutcast stream using node-radio-stream and pushing it into a HTML5 element using chunked encoding. But it only works in Safari!
我一直在 Node.js 中尝试二进制流,令我惊讶的是,它确实有一个使用 node-radio-stream 获取 Shoutcast 流并使用分块编码将其推送到 HTML5 元素的工作演示。但它只适用于 Safari!
Here is my server code:
这是我的服务器代码:
var radio = require("radio-stream");
var http = require('http');
var url = "http://67.205.85.183:7714";
var stream = radio.createReadStream(url);
var clients = [];
stream.on("connect", function() {
console.error("Radio Stream connected!");
console.error(stream.headers);
});
// When a chunk of data is received on the stream, push it to all connected clients
stream.on("data", function (chunk) {
if (clients.length > 0){
for (client in clients){
clients[client].write(chunk);
};
}
});
// When a 'metadata' event happens, usually a new song is starting.
stream.on("metadata", function(title) {
console.error(title);
});
// Listen on a web port and respond with a chunked response header.
var server = http.createServer(function(req, res){
res.writeHead(200,{
"Content-Type": "audio/mpeg",
'Transfer-Encoding': 'chunked'
});
// Add the response to the clients array to receive streaming
clients.push(res);
console.log('Client connected; streaming');
});
server.listen("8000", "127.0.0.1");
console.log('Server running at http://127.0.0.1:8000');
My client code is simply:
我的客户端代码很简单:
<audio controls src="http://localhost:8000/"></audio>
This works fine in Safari 5 on the Mac, but doesn't seem to do anything in Chrome or Firefox. Any ideas?
这在 Mac 上的 Safari 5 中运行良好,但在 Chrome 或 Firefox 中似乎没有任何作用。有任何想法吗?
Possible candidates including encoding issues, or just partially-implemented HTML5 features...
可能的候选包括编码问题,或者只是部分实现的 HTML5 功能......
采纳答案by TooTallNate
Here's a (slightly outdated) summary of the current status of HTML5 Audio and Icecast streams.
这是 HTML5 音频和 Icecast 流当前状态的(稍微过时的)摘要。
As you can see, a MP3 source only seems to work in Safari (and possibly IE9). You might need to experiment with some server-side transcoding (with ffmpegor mencoder) to OGG Vorbis. I'm pretty sure I was able to get Chrome to behave properly when I was sending Vorbis data.
如您所见,MP3 源似乎只适用于 Safari(也可能适用于 IE9)。您可能需要尝试一些服务器端转码(使用ffmpeg或mencoder)到 OGG Vorbis。我很确定我在发送 Vorbis 数据时能够让 Chrome 正常运行。
Firefox was still being a brat though, maybe it doesn't like the chunked encoding (all SHOUTcast servers respond with a HTTP/1.0version response, which hadn't defined Transfer-Encoding: chunkedyet). Try sending a Transfer-Encoding: identityresponse header with the OGG stream to disable chunked, and Firefox MIGHT work. I haven't tested this.
Firefox 仍然是一个小子,也许它不喜欢分块编码(所有 SHOUTcast 服务器HTTP/1.0都以尚未定义的版本响应进行响应Transfer-Encoding: chunked)。尝试Transfer-Encoding: identity使用 OGG 流发送响应头以禁用chunked,Firefox 可能会工作。我没有测试过这个。
Let me know how it goes! Cheers!
让我知道事情的后续!干杯!

