同时从binaryjs服务器播放传入的ArrayBuffer音频二进制数据

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了同时从binaryjs服务器播放传入的ArrayBuffer音频二进制数据相关的知识,希望对你有一定的参考价值。

美好的一天!今天早上我正在进行视频聊天流媒体播放,我遇到了传入的ArrayBuffer问题,其中包含音频的二进制数据。

这是我找到的用于播放二进制音频数据的代码(Uint8Array):

function playByteArray(byteArray) {
    var arrayBuffer = new ArrayBuffer(byteArray.length);
    var bufferView = new Uint8Array(arrayBuffer);
    for (i = 0; i < byteArray.length; i++) {
        bufferView[i] = byteArray[i];
    }
    context.decodeAudioData(arrayBuffer, function(buffer) {
        buf = buffer;
        play();
    });
}

// Play the loaded file
function play() {
    // Create a source node from the buffer
    var source = context.createBufferSource();
    source.buffer = buf;
    // Connect to the final output node (the speakers)
    source.connect(context.destination);
    // Play immediately
    source.start(0);
}

现在在下面,我使用了https://github.com/streamproc/MediaStreamRecorder的MediaStreamRecorder来记录来自getUserMedia的流。此代码将连续将记录的二进制数据发送到服务器。

if (navigator.getUserMedia) {
        navigator.getUserMedia({audio: true, video: true}, function(stream) {
            video.src = (window.URL || window.webkitURL).createObjectURL(stream); //get this for video strewam url
          video.muted = true;
            multiStreamRecorder = new MultiStreamRecorder(stream);
            multiStreamRecorder.canvas = {
              width: video.width,
              height: video.height
            };
            multiStreamRecorder.video = video;

          multiStreamRecorder.ondataavailable = function(blobs) {
            var audioReader = new FileReader();
              audioReader.addEventListener("loadend", function() {
                var arrBuf = audioReader.result;
                var binary = new Uint8Array(arrBuf);
                streamToServ.write(binary);
                // streamToServ is the binaryjs client
              });
              audioReader.readAsArrayBuffer(blobs.audio);
            };
          multiStreamRecorder.start(1);
        }, onVideoFail);
    } else {
        alert ('failed');
    }

将生成的blob(音频和视频)转换为二进制文件并将其发送到binaryjs,它将在另一个客户端上播放:

client.on('stream', function (stream, meta) {
    stream.on('data', function(data) {
        playByteArray(new Uint8Array(data));
    });
});

我在传输二进制数据时没有遇到任何问题,但问题是在播放的每个二进制数据上播放中都会出现打嗝声。我如何播放传入的ArrayBuffers有什么问题吗?我也在考虑向streamproc提出这个问题。

提前致谢!

干杯。

答案

我通过制作音频缓冲区排队找到了解决这个问题的方法。大多数代码来自这里:

Choppy/inaudible playback with chunked audio through Web Audio API

谢谢。

另一答案

不确定这是否是问题,但也许不是source.start(0),你应该使用source.start(time),其中时间是你想要启动源的地方。 source.start(0)将立即开始播放。如果您的字节数组比实时更快,则源可能会重叠,因为您可以尽快启动它们。

以上是关于同时从binaryjs服务器播放传入的ArrayBuffer音频二进制数据的主要内容,如果未能解决你的问题,请参考以下文章

在 SSL 上使用 BinaryJS 会引发安全异常

从同一个文件同时录制和播放

c#做vlc开发,如果传入的rtsp无效怎么判断

从 PHP 调用 Perl 脚本并传入变量,同时还使用可变的 perl 脚本名称

Android MediaPlayer:同时播放多个声音。我的代码是

从通知控制中心同时播放多个音频