如何使用node.js 和socket.io 通过WebSockets 传输MP3 数据？

Question

我在使用 Node.js 和 socket.io 通过 WebSocket 传输 MP3 数据时遇到问题。一切似乎都正常，但解码音频数据对我来说不公平。

这是我的玩具服务器：

var app = require('http').createServer(handler)
  , io = require('socket.io').listen(app)
  , fs = require('fs')

app.listen(8081);

function handler (req, res) {
    res.writeHead(200, {
        'Content-Type': 'text/html',
    });
    res.end('Hello, world!');
}

io.configure('development', function() {
  io.set('log level', 1);

  io.set('transports', [ 'websocket' ]);
});

io.sockets.on('connection', function (socket) {
    console.log('connection established');

    var readStream = fs.createReadStream("test.mp3", 
                                         {'flags': 'r',
                                          'encoding': 'binary', 
                                          'mode': 0666, 
                                          'bufferSize': 64 * 1024});
    readStream.on('data', function(data) {
        console.log(typeof data);
        console.log('sending chunk of data')
        socket.send(data);
    });

    socket.on('disconnect', function () {
        console.log('connection droped');
    });
});

console.log('Server running at http://127.0.0.1:8081/');

客户端接收字符串类型的数据，但我想将数据提供给decodeAudioData，但它似乎不喜欢字符串。对decodeAudioData 的调用会导致以下错误消息：

Uncaught Error: SYNTAX_ERR: DOM Exception 12

我认为decodeAudioData 需要存储在ArrayBuffer 中的数据。有没有办法转换数据？

这是客户端代码：

<script src="http://127.0.0.1:8081/socket.io/socket.io.js"></script>
<script>
    var audioBuffer = null;
    var context = null;
    window.addEventListener('load', init, false);
    function init() {
        try {
            context = new webkitAudioContext();
        } catch(e) {
            alert('Web Audio API is not supported in this browser');
        }
    }

    function decodeHandler(buffer) {
        console.log(data);
    }

    var socket = io.connect('http://127.0.0.1:8081');
    socket.on('message', function (data) {
            // HERE IS THE PROBLEM
        context.decodeAudioData(data, decodeHandler, function(e) { console.log(e); });
    });
</script>

Answer 1

我自己找到了一种通过 Websockets 传输 MP3 数据的方法。

问题之一是 MP3 数据的块大小。看来 Web Audio API 需要提供有效的 MP3 块才能解码数据。也许并不奇怪。在我的演示应用程序中，我提供了一组 MP3 块文件。

此外，音频质量并不完美。我有一些微妙的故障。我可以通过发送更大的 MP3 数据块来改进这一点，但仍然有微小的裂纹。

编辑：我设法提高了音频质量。看来 Web Audio 方法decodeAudioData 并不是真正设计用于解码 MP3 数据的连续块。

Answer 2

在您的情况下， context.decodeAudioData 需要二进制数据的 ArrayBuffer ，我建议将您的块转换为 base64 字符串，然后转换为 ArrayBuffer 客户端以获得最可预测的结果。 此脚本应该是一个很好的起点客户端对分块数据进行 Base64 解码。

在获取数据（base-64 编码字符串）后立即添加一行 data = Base64Binary.decodeArrayBuffer(data); 即可解决问题...

Answer 3

看来socket.io仍然不支持二进制传输。所以这里可以使用 websocket.io 。

1. https://github.com/LearnBoost/socket.io/issues/511 #issuecomment-2370129
2. https://github.com/LearnBoost/socket.io/issues/680#issuecomment -3083490