node.js - 使用 WebRTC.io 和 NodeJS 到达时连接到房间

Question

我实际上正在开发一个基于 NodeJS、ws、WebRTC.io 和 socket.io 的应用程序。此应用程序的目的是将主持人的视频广播给多个与会者。

主持人和所有与会者加载 Web 应用程序，然后主持人启动他的视频并将其流式传输给所有与会者。对于这种情况，我没有任何问题，但如果主持人启动他的视频，然后与会者加入房间，该与会者将无法检索流，而且我不知道如何获取此流。

我尝试了很多解决方案。

第一个解决方案

当与会者到达房间时，他通过 socket.io 向主机发送一条消息，主机发回他的流。问题是流作为对象而不是 MediaStream 到达与会者，因此我无法使用它。

第二个解决方案

当与会者到达房间时，他通过 socket.io 向主持人发送一条消息，主持人发回使用 window.webkitURL.createObjectURL(rtc.streams[0]) 创建的 blob，然后我使用此 blob 作为与会者的视频源，但收到 404 错误。

这是两种解决方案的代码:

var isStreamCreated = false;

function startVideoLive() {
    var video = document.getElementById('video');
    //Test if peer connection is available for the browser
    if (PeerConnection) {
        if (getRole() == 1) {
            rtc.createStream({
                "video": true,
                "audio": true
            }, function (stream) {
                video.src = URL.createObjectURL(stream);
                video.play();
                isStreamCreated = true
            });

        }
    }
    if (isConnected != true) {
        var room = '1234';
        rtc.connect('ws://' + server + ':8443', room);
        isConnected = true;
    }
}

function setAttendeeWebRTC() {
    if (getRole() == 0) {
        var message = {
            type: "getStreamInfos",
            URL: null,
            stream: null
        }

        socket.emit('message', message);

        rtc.on('add remote stream', function (stream, socketId) {
            rtc.attachStream(stream, 'video');
            isStreamCreated = true;
        });
    }
}

startVideoLive();
setAttendeeWebRTC();

function onGetStreamInfos(message) {
    if (getRole() == 1 && isStreamCreated == true) {

        message.URL = window.webkitURL.createObjectURL(rtc.streams[0]);
        message.stream = rtc.streams[0];

        socket.emit('message', message);
    } else if (getRole() == 0 && isStreamCreated == false && message.URL != null && message.stream != null) {

        document.getElementById('video').src = message.URL;
        // OR
        rtc.attachStream(message.stream, 'video')
        isStreamCreated = true;

    }
}

getRole() 用于了解连接的用户是与会者 (0) 还是主持人 (1)。

在服务器端，我只是广播 websocket 消息，并添加 webrtc.io (以及许多其他内容，但在本例中没有用)。

这是 2 种情况的错误:

• 使用 blob:GET blob:http%3A//128.1.222.159%3A8081/881928b6-70d3-4054-b15e-88d635a2125f 404(未找到)

• 使用流:未捕获类型错误:类型错误
  rtc.attachStream
  onGetStreamInfos
  (匿名函数)
  EventEmitter.emit socket.io.js?=1375350434038:633
  SocketNamespace.onPacket socket.io.js?=1375350434038:2248
  Socket.onPacket socket.io.js?=1375350434038:1930
  Transport.onPacket socket.io.js?=1375350434038:1332
  Transport.onData socket.io.js?_=1375350434038:1303
  WS.open.websocket.onmessage

如果有人对我如何处理我的问题有任何想法，我会提前致谢。

编辑1:

我找到了如何解决我的问题，但是有一个新问题。这是我的部分解决方案:

function onGetStreamInfos(message) {
    if (getRole() == 1 && isStreamCreated == true) {

        rtc.createPeerConnections();
        rtc.addStreams();
        rtc.addDataChannels();
        rtc.sendOffers()

    } else if (getRole() == 0 && isStreamCreated == false) {

        isStreamCreated = true;

    }
}

但是现在，当一名与会者加入房间时，其他与会者就会丢失视频。我认为这是因为通常我不应该在新与会者和旧与会者之间创建对等连接。

我不确定它是否很清楚，但如果您需要更多信息，请随时询问，如果我最终找到如何解决我的问题，我会在这里给出解决方案。

编辑2:

通过删除 rtc.createPeerConnections(); 和 rtc.addDataChannels(); 它似乎在大多数情况下都有效(我没有测试太多情况)。

Answer 1

如果我正确理解您的问题，您似乎正在尝试通过 Socket.io 消息传递交换视频数据，而这需要通过 RTCPeerConnection 完成。

无耻的 self 推销，但你可能想看看 WebRTC codelab我写的，它使用 Socket.io 进行信号发送。

对于少数与会者，您可以使用多个 RTCPeerConnections。 (看看 Talky 、 Tawk 、 FACEmeeting 或 Browser Meeting 等应用程序。)

对于更多与会者，您需要使用 MCU (有可用的开源实现)，或者推出您自己的服务器端 WebRTC 应用程序。今年的 Google I/O 演示中提供了有关 WebRTC 架构的更多信息:video , slides 。