Question

我正在尝试使用webrtc开发视频会议Web应用程序。我正在使用socket.io进行信号传输。当一个参与者创建房间并由另一个参与者加入房间时。它在服务器终端上显示他们已成功加入，但在浏览器上只有本地视频正在流式传输，而远程则不是。作为我的Firefox浏览器上的DOMException显示为：

DOMException 代码：0 columnNumber：0 数据：空文件名： ”” lineNumber：0 消息：“无法创建没有本地曲目的报价，没有offerToReceiveAudio / Video，也没有DataChannel。”名称： “ InternalError”结果：0堆栈：“” proto ：DOMExceptionPrototype {名称：Getter，消息：Getter，INDEX_SIZE_ERR：1，…

在client.js：81：68

我的客户端脚本如下

var divConsultingRoom = document.getElementById("consultingRoom");
var localVideo = document.getElementById("localVideo");
var remoteVideo = document.getElementById("remoteVideo");
var localStream;
var remoteStream;
var rtcPeerConnection;
//Stun Server
var iceServers={
    'iceServers':[
        {'urls':'stun:stun.services.mozilla.com'},
        {'urls':'stun:stun.l.google.com:19302'}
        ]
}
var streamConstraints = {audio:true,video:true};
var isCaller;

//Socket.io server connection
var socket= io();

//button click event
btnGoRoom.onclick = function(){
    if(inputRoomNumber.value===""){
       alert("Please type a room number")
       }
    else{
        roomNumber= inputRoomNumber.value;
        socket.emit('create or join',roomNumber);
        divSelectRoom.style="display:none;";
//        divConsultingRoom.style="display:block;";
    }

};

//when server emits created
socket.on('created',function(room){
          //caller gets user media devices with the defined constraints
          navigator.mediaDevices.getUserMedia(streamConstraints).then(function(stream){
                localStream = stream;
                //localVideo.src = URL.createObjectURL(stream);
                localVideo.srcObject = stream;
                isCaller=true;

            }).catch(function(err){
    console.log('An error ocurred when accessing media devices');
});
          });

//when server emits joined
socket.on('joined',function(room){
    navigator.mediaDevices.getUserMedia(streamConstraints).then(function(stream){
        localStream= stream;
        //localVideo.src= URL.createObjectURL(stream);
         localVideo.srcObject = stream;

        socket.emit('ready',roomNumber);
    }).catch(function(err){
        console.log('An error ocurred when accessing media devices');
    });
});


//when server emits ready 
socket.on('ready',function(){
    if(isCaller){
        //creates an RTCPeerConncetion object
        rtcPeerConnection = new RTCPeerConnection(iceServers);

        //add event listeners to the newly created object
        rtcPeerConnection.onicecandidate = onIceCandidate;
        rtcPeerConnection.ontrack= onAddStream;

        //adds the current local stream to the object
        rtcPeerConnection.ontrack(localStream);

        //prepare the offer
        rtcPeerConnection.createOffer(setLocalAndOffer,function(e){console.log(e)},setSdpConstraints);
    }
});

var setSdpConstraints= {
        mandatory: {
            'OfferToReceiveAudio': true,
        'OfferToReceiveVideo': true
        },
        'OfferToReceiveAudio': true,
        'OfferToReceiveVideo': true

    };

//when servers emits offer
socket.on('offer',function(event){
    if(!isCaller){
        rtcPeerConnection = new RTCPeerConnection(iceServers);

        rtcPeerConnection.onicecandidate=onIceCandidate;
        rtcPeerConnection.onaddstream = onAddStream;

        rtcPeerConnection.addStream(localStream);

        rtcPeerConnection.createAnswer(setLocalAndAnswer,function(e){console.log(e)});
    }
});


socket.on('answer',function(event){
    rtcPeerConnection.setRemoteDescription(new RTCSessionDescription(event));
});

socket.on('candidate',function(event){
    var candidate = new RTCIceCandidate({
        sdpMLineIndex:event.label,
        candidate:event.candidate
    });
    rtcPeerConnection.addIceCandidate(candidate);
});

function onAddStream(event){
   // remoteVideo.src= URL.createObjectURL(event.stream);
    remoteVideo.srcObject = event.stream;
    remoteStream= event.stream;
}

function onIceCandidate(event){
    if(event.candidate){
        console.log('sending ice candidate');
        socket.emit('candidate',{
                    type:'candidate',
                    lable: event.candidate.sdpMLineIndex,
                    id: event.candidate.sdpMid,
                    candidate:event.candidate.candidate,
                    room:roomNumber
                    })
    }
}

function setLocalAndOffer(sessionDescription){
    rtcPeerConnection.setLocalDescription(sessionDescription);
    socket.emit('offer',{
        type:'offer',
        sdp:sessionDescription,
        room: roomNumber
    });
}

function setLocalAndAnswer(sessionDescription){
    rtcPeerConnection.setLocalDescription(sessionDescription);
    socket.emit('answer',{
        type:'answer',
        sdp:sessionDescription,
        room:roomNumber
    });
}

client.js：81是：

 rtcPeerConnection.createOffer(setLocalAndOffer,function(e){console.log(e)},setSdpConstraints);

谢谢

Answer 1

在创建要约之前，您必须先执行addTrack或addStream。

DOMException：“无法创建没有本地轨道，offerToReceiveAudio / Video和DataChannel的商品” webRTC应用程序

1 个答案: