Question

我尝试在我的应用中使用此sample实现代码，但出了点问题。问题是我的第二个同伴，不要在<video>

上播放流

算法的简短描述如下： “主机”对等体从摄像机获取流并在自<video>上显示，然后与第二对等体建立连接并向其发送流。第二个对等体接收流并在他的<video>

上显示

问题是我的第二个对等接收流，但无法播放。为什么？我不知道。

这里有我的应用程序中的一些代码：

Host Peer init：

var configuration ={
  'iceServers': [
    {
      "urls": "turn:numb.viagenie.ca",
      "username": "xxxxxx@gmail.com",
      "credential": "xxxxx"
    }
  ],RTCIceTransportPolicy:'all'
};

var offerOptions = { offerToReceiveVideo: 1, offerToReceiveAudio: 1 };
const peer = new RTCPeerConnection(configuration);
peer.addStream(this.stream);
peer.createOffer(
      (desc)=>{
        console.log("host createOffer ", desc)
        peer.setLocalDescription(desc).then(
          (data)=>{
            console.log("host setLocalDesc succes")
            this.sendInvitation(desc, user)
        },(error)=>{
            console.log("host setLocalDesc error")
        });

      },(error)=>{
        console.log("host createOffer error",error)
      },
      offerOptions
    );

this.sendInvitation（desc，user）通过websockets发送desc对象 “第二个”同伴

接受新同行的主机代码

client.setRemoteDescription(clientAnswer).then(
  (data) => console.log("host setRemote succes"),
  (error) => console.log("host setRemote succes")
)

client.onicecandidate = function(e){
  console.log("try to addIceCandidate",e);
  client.addIceCandidate(e.candidate).then(
    (data)=>console.log("host addIceCandidate succes"),
    (error)=>console.log("host addIceCandidate error")
  );
};

client.oniceconnectionstatechange = function(e){
  console.log("host connectionChange", e)
};

客户端，“第二个”对等初始化

var configuration ={
  'iceServers': [
    {
      "urls": "turn:numb.viagenie.ca",
      "username": "xxxxx@gmail.com",
      "credential": "xxxxx"
    }
  ],RTCIceTransportPolicy:'all'
};

this.peerClient = new RTCPeerConnection(configuration);

this.peerClient.onaddstream = (ev)=>{
  this.isConnected = true;
  console.log("client onAddStream ", ev);

  if (this.video.nativeElement.srcObject !== ev) {

    var streams = this.peerClient.getRemoteStreams();

    console.log(this.peerClient.getLocalStreams())
    console.log(this.peerClient.getRemoteStreams())
    console.log(streams[0].getTracks())
    console.log(ev.stream)

    this.video.nativeElement.srcObject = ev.stream;
    this.stream = ev.stream;
  }

  this.calculateChatHeight();
};

“客户端”/“第二”对等端的功能 - 加入按钮

this.peerClient.setRemoteDescription(peerOffer).then(
        (data) => console.log("client setRemote succes",data),
        (error) => console.log("client setRemote error",error)
      )

      this.peerClient.createAnswer().then(
        (desc)=>{

          this.peerClient.setLocalDescription(desc).then(
            (data) => console.log("client setLocal succes", data),
            (error) => console.log("client setLocal error", error)
          );

          this.answer = desc;

          this.sendPeerAnswer();

        },(error) => console.log("client createAnswer error", error)
      )

      this.peerClient.onicecandidate = (e)=>{
        this.peerClient.addIceCandidate(e.candidate).then(
          (data)=>console.log("client addIceCandidate succes", data),
          (error)=>console.log("client addIceCandidate error", error)
        )
      };

现在，代码看起来不错，但视频没有在客户端上显示

请从客户端控制台查看此屏幕 - 一切看起来都不错。

你知道什么是错的吗？请帮忙

编辑我发现错误在IceConnection中。正确的方法 IceConnection是ICE状态：new =＆gt; checking =＆gt; connected =＆gt;完成但在我的例子中停止在CHECKING。你知道为什么吗？

WebRTC无法显示来自同行的视频

0 个答案: