Question

我正在使用peerjs

媒体电话

var getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
getUserMedia({video: true, audio: true}, function(stream) {
  var call = peer.call('another-peers-id', stream);
  call.on('stream', function(remoteStream) {
    // Show stream in some video/canvas element.
  });
}, function(err) {
  console.log('Failed to get local stream' ,err);
});

答案

var getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
peer.on('call', function(call) {
  getUserMedia({video: true, audio: true}, function(stream) {
    call.answer(stream); // Answer the call with an A/V stream.
    call.on('stream', function(remoteStream) {
      // Show stream in some video/canvas element.
    });
  }, function(err) {
    console.log('Failed to get local stream' ,err);
  });
});

问题是：要获取remoteStream，我需要显示自己的流

var call = peer.call('another-peers-id', stream);

如何在不显示自己的信息流的情况下播放其他信息流？

Answer 1

这不是一个错误，您只是对WebRTC API的工作方式感到困惑。我们首先创建一个名为getUserMedia的函数变量，它将映射到浏览器提供的本机webrtc方法（例如，如果浏览器是Chrome，则方法navigator.getUserMedia将被分配给此变量，其余将为null 。同样，如果浏览器是Firefox，则将本机方法navigator.mozGetUserMedia分配给此变量，其余为空，依此类推。）

一旦将适当的本机方法分配给变量getUserMedia，我们就会使用适当的参数调用此方法。第一个参数是我们想要创建的呼叫类型（即媒体约束），例如，仅限音频，音频+视频等。第二个参数是成功时的回调（即，当浏览器成功访问并连接到本地麦克风和/或相机等时）。这个回调函数的一个例子是，

function(stream) {
  var video = document.querySelector('video');
  video.srcObject = stream;
  video.onloadedmetadata = function(e) {
    // Do something with the video here.
  };
}

getUserMedia方法的第三个参数是可选的，在示例代码中缺少，这个参数是对另一个方法的回调，如果getUserMedia方法失败，它将启动。可能有许多失败的原因，例如用户不允许浏览器访问本地麦克风或摄像头等。使用此回叫方法，您可以通知用户有关呼叫失败的问题。

以下是完整的示例代码（参考https://developer.mozilla.org/en-US/docs/Web/API/Navigator/getUserMedia）

var getUserMedia = navigator.getUserMedia ||
                   navigator.webkitGetUserMedia ||
                   navigator.mozGetUserMedia;

if (getUserMedia) {
  getUserMedia({ audio: true, video: { width: 1280, height: 720 } },
  function(stream) {
    var video = document.querySelector('video');
    video.srcObject = stream;
    video.onloadedmetadata = function(e) {
      video.play();
    };
  },
  function(err) {
    console.log("The following error occurred: " + err.name);
  }
);
} else {
  console.log("getUserMedia not supported");
}

如果您不想发送自己的音频和/或视频，只需在媒体约束变量中将其设置为false。

希望这有帮助。

webrtc和peerjs：如何在不启动自己的流的情况下播放流？

1 个答案: