我正在尝试测试WebRTC并希望显示我自己的流以及对等的流。我目前有一个简单的垫片来获取摄像机的流和管道到视频元素,但帧速率非常低。关于这一点的罕见之处在于,我可以尝试WebRTC网站上的示例,它们可以完美地工作......视频流畅且没有任何问题。我去控制台,我的代码类似于他们的......可能会发生什么?我试图创建一个fiddle并在括号内运行该代码,但它仍然执行得非常糟糕。
video = document.getElementById('usr-cam');
navigator.mediaDevices.getUserMedia({video : {
width : {exact : 320},
height : {exact: 240}
}})
.then(function(stream){
if(navigator.mozGetUserMedia)
{
video.mozSrcObject = stream;
}
else
{
video.srcObject = stream;
}
})
.catch(function(e){
alert(e);
});
几乎我所做的一切。考虑到我使用的是新的navigator.mediaDevices()
API而不是navigator.getUserMedia()
,但我不知道这是多么重要因为1.我正在使用名为{{1}的WebRTC组提供的填充程序他们自己使用的。 2.我不认为你如何获得视频流会影响性能。
答案 0 :(得分:19)
好吧,我觉得这个非常愚蠢...我有点被视频元素更新显示的图像,而不必管理输出流,这意味着图像会更新但只是在很长的时间间隔内,看起来好像视频是滞后的。我忘了做的事实上是play()
视频或添加autoplay
作为其属性......现在效果很好。