WebRTC Peer ontrack被呼叫,但视频不能播放。

问题描述 投票:0回答:1

我有一个远程的点对点发送视频到本地点对点,我使用自己的信令服务器。我使用自己的信令服务器。

流程是这样的。

  1. 远程对等体通过信令服务器向本地对等体发送提议。

  2. 本地点对点接受报价并创建应答,然后通过信令服务器发送给远程点对点。

  3. 远程对等体接受应答并开始发送视频,点对点。

    我在本地对等体的createAnswer部分有一些问题。如果我通过点击一个按钮手动发送答案给远程对等体,那么视频播放正常。但是从内部发送答案的时候 pc.onicecandidate 它不工作。

以下是代码

 var answer;
 async function createAnswer(offer) {
   
   if (pc.signalingState != "stable") return;
   await pc.setRemoteDescription({type: "offer", sdp: offer});
   await pc.setLocalDescription(await pc.createAnswer());
   pc.onicecandidate = ({candidate}) => {
     if (candidate) return;
      answer = pc.localDescription.sdp;
      sendAnswerToSignalingServer({ peer_type: "web",remote_peer: "RPi_Dev", type: "answer",  name: userLoggedIn, sdp:answer }); 

   };
 }

使用上面的代码,除了播放视频外,所有的事情都能正常进行,甚至连事件都能正常进行。

pc.ontrack = function (event) {
  remoteVideo.srcObject =event.streams[0];
  //alert('new stream added! ' + event.streams[0]);
}

得到调用,但视频不播放。

但如果我评论 sendAnswerToSignalingServer 以上,并通过按钮点击发送答案,然后一切正常。

function sendSignalButtonClick(){
   sendAnswerToSignalingServer({ peer_type: "web",remote_peer: "RPi_Dev", type: "answer",  name: userLoggedIn, sdp:answer }); 
}

我觉得createAnswer部分的代码有问题。

我指的是这里的代码 WebRTC数据通道的手动信令,请举例说明?.

谁能帮我解决这个问题。

编辑:完整的代码

var userLoggedIn = "userWeb";
const config = {iceServers: [{urls: "stun:stun.l.google.com:19302"}]};
const pc = new RTCPeerConnection(config);

const dc = pc.createDataChannel("chat", {negotiated: true, id: 0});


pc.ontrack = function (event) {
  remoteVideo.srcObject = event.streams[0];

}

 
 var SDP;
 async function createAnswer(offer) {
   
   if (pc.signalingState != "stable") return;
   await pc.setRemoteDescription({type: "offer", sdp: offer});
   const answer = await pc.createAnswer();
   await pc.setLocalDescription(answer);
    pc.onicecandidate = async ({candidate}) => {
    if (candidate) return;
       SDP = await pc.localDescription.sdp;
       sendToWebSocket({ peer_type: "web",remote_peer: "RPi_Dev", type: "answer",  name: userLoggedIn, sdp:SDP }); 
     
   };
 

 }

async function sendSignalButtonClick() {
   SDP = await pc.localDescription.sdp;
   sendToWebSocket({ peer_type: "web",remote_peer: "RPi_Dev", type: "answer",  name: userLoggedIn, sdp:SDP }); 
}
 

function SendMessage(message) {
   dc.send(message);

 };


//********************************Signaling server part***************************/

var webSockConn = new WebSocket('wss://220.168.551.150:7000');

webSockConn.onopen = function () { 
    console.log("Connected to the signaling server"); 
    sendToWebSocket({ peer_type: "web",remote_peer: "RPi_Dev", type: "login",  name: userLoggedIn }); 
};


//when we got a message from a signaling server 
webSockConn.onmessage = function (msg) { 
   console.log("Got message", msg.data);
    
   var data = JSON.parse(msg.data);
    
   switch(data.type) { 
      case "offer": 
     console.log(data);
         createAnswer(data.offer, data.name); 
         break; 
      case "leave": 
         handleLeave(); 
         break; 
      default: 
         break; 
   } 
};
  
webSockConn.onerror = function (err) { 
   console.log("webSockConn----Got error", err); 
};

function handleLeave(){

   console.log("Leaving ......................"); 
}
  
//alias for sending JSON encoded messages 
function sendToWebSocket(message) { 
   //attach the other peer username to our messages 
   if (userLoggedIn) { 
      message.name = userLoggedIn; 
   } 
    
   webSockConn.send(JSON.stringify(message)); 
};



/*********************************************************************************/
javascript webrtc
1个回答
1
投票

尝试用 await 创建答案。

answer = await pc.localDescription.sdp;

把功能改为async

pc.onicecandidate = async ({candidate}) => {
© www.soinside.com 2019 - 2024. All rights reserved.