WebRTC双视频报价消息答案

【问题标题】：WebRTC double video-offer messageWebRTC双视频报价消息
【发布时间】：2016-11-14 13:16:56
【问题描述】：

我正在尝试使用 WebRTC 构建视频聊天。我遇到的问题是视频报价是双方都喜欢的：

PC1 -> send video-offer
PC2 <- handle video-offer message
PC2 -> send video-answer
PC1 <- handle video-answer (when there is debugger breakpoint, the connection is working)
PC2 -> send video-offer
...

我只在negotiationEventHandler 中发送视频报价消息：

function handleNegotiationNeededEvent() {
    logMessage('HandleNegotiationNeededEvent fired!');
    myPeerConnection.createOffer() //tworzymy SDP offer dla drugiego uzytkownika
        .then(function (offer) {
        return myPeerConnection.setLocalDescription(offer);
    })
        .then(function () {
            sendToWebSocket(msgTypeVideoOffer, senderId, receiverId, JSON.stringify(myPeerConnection.localDescription));
        })
        .catch(reportError);
}

并在两个函数中处理 video-offer / video-answer

function handleVideoOfferMsg(msg){
    logMessage("handle video-offer message call");
    var localStream = null;

    createPeerConnection();

    var desc = new RTCSessionDescription(JSON.parse(msg.messageContent));
    debugger;
    myPeerConnection.setRemoteDescription(desc)
        .then(function () {
            return navigator.mediaDevices.getUserMedia(mediaConstraints);
        })
        .then(function (stream) {
            localStream = stream;
            document.getElementById("local_video").srcObject = localStream;
            myPeerConnection.addStream(localStream);
        })
        .then(function () { //Utworz odpowiedz
            return myPeerConnection.createAnswer();
        })
        .then(function (answer) { //Ustaw ja sobie jako lokalna
            return myPeerConnection.setLocalDescription(answer);
        })
        .then(function () { //I wyslij SDP do peera
            sendToWebSocket(msgTypeVideoAnswer, senderId, receiverId, JSON.stringify(myPeerConnection.localDescription));
        })
        .catch(handleGetUserMediaError);
}

function handleVideoAnswerMessage(message) {
    logMessage("handle video answer message" + message);
    var desc = message.messageContent;
    myPeerConnection.setRemoteDescription(JSON.parse(desc));
}

问题是，处理视频报价正在设置一个新对象，这可能是失去连接的原因。

【问题讨论】：

标签： websocket connection webrtc

【解决方案1】：

这是bug in the Chrome browser。 MDN 是对的，这在 Firefox 中运行良好。

对于基本的sendrecv 音频+视频报价，应允许应答者添加一个视频和一个音频流并调用setLocalDescription，而不会触发negotiationneeded 事件。

在添加了预期的音频和视频后，Chrome 无法在应答端clear negotiationneeded，实际上会一直不断地来回触发协商。

【讨论】：

【解决方案2】：

答案是，每次成功调用 RTCPeerConnection.addStream() 函数时都会触发negotiationneeded 事件。所以我的解决方案是检查是否只有邀请者设置了这样的事件处理程序：

if(isInviter){
        myPeerConnection.onnegotiationneeded = handleNegotiationNeededEvent;
    }

我的问题代码是基于mozilla WebRTC Signaling sample，只是实现错误，所以要小心使用它：https://developer.mozilla.org/en-US/docs/Web/API/WebRTC_API/Signaling_and_video_calling

【讨论】：