使用WebRTC流媒体文件

Question

这是我的用例:爱丽丝有一个很酷的新媒体曲目,她希望鲍勃收听.她在浏览器中选择媒体文件,媒体文件立即开始在Bob的浏览器中播放.

我现在还不确定是否可以使用WebRTC API进行构建.我可以找到的所有示例都使用通过getUserMedia()获得的流,但这就是我所拥有的:

var context = new AudioContext();
var pc = new RTCPeerConnection(pc_config);

function handleFileSelect(event) {
    var file = event.target.files[0];

    if (file) {
        if (file.type.match('audio*')) {
            console.log(file.name);
            var reader = new FileReader();

            reader.onload = (function(readEvent) {
                context.decodeAudioData(readEvent.target.result, function(buffer) {
                    var source = context.createBufferSource();
                    var destination = context.createMediaStreamDestination();
                    source.buffer = buffer;
                    source.start(0);
                    source.connect(destination);
                    pc.addStream(destination.stream);
                    pc.createOffer(setLocalAndSendMessage);
                });
            });

            reader.readAsArrayBuffer(file);
        }
    }
}

在接收方面,我有以下内容:

function gotRemoteStream(event) {
    var mediaStreamSource = context.createMediaStreamSource(event.stream);
    mediaStreamSource.connect(context.destination);
}

此代码不会使媒体(音乐)在接收方播放.但是,在WebRTC握手完成并且调用了gotRemoteStream函数之后,我确实收到了一个已结束的事件.该gotRemoteStream函数被调用的介质不开始播放.

在爱丽丝的一面,神奇的假设发生在说明source.connect(目的地)的行中.当我用source.connect(context.destination)替换该行时,媒体开始通过Alice的扬声器正确播放.

在Bob的一侧,基于Alice的流创建媒体流源.但是,当使用mediaStreamSource.connect(context.destination)连接本地扬声器时,音乐不会通过扬声器开始播放.

当然,我总是可以通过DataChannel发送媒体文件,但那里的乐趣在哪...

关于我的代码有什么问题或者如何实现我的用例的一些想法的任何线索将不胜感激!

我正在使用最新最好的Chrome Canary.

谢谢.

Answer 1

可以使用Audio元素播放音频，如下所示：

function gotRemoteStream(event) {
    var player = new Audio();
    attachMediaStream(player, event.stream);
    player.play();
}

通过 WebAudio API 播放音频对我来说还不起作用。