从MediaStream对象获取媒体详细信息（分辨率和帧速率） [英] Get media details(resolution and frame rate) from MediaStream object

问题描述

我正在捕捉用户的相机，我想以最佳分辨率捕捉到图片，所以我的代码就像下面的代码片段一样，

I am capturing the user's camera, i want to catch the picture with the best resolution possible, so my code is something like the snippet below,

我想要从传入的流中读取分辨率详细信息，因此我可以将其设置为视频高度和宽度，我将用于单击快照，我希望快照具有流提供的最佳质量，这是否可行（读取分辨率详细信息）从流变量）？

I want to read the resolution details from the incoming stream, so i can set it as video height and width, which I ll use to click snapshot, I want the snapshot to be of best quality offered by the stream, is this possible( to read resolution details from stream variable) ?

编辑：我正在使用<$传输视频c $ c> webrtc 所以我还想找出传输的视频流的帧速率

EDIT : I am transmitting the video using webrtc so I would also like to find out the frame rate of the transmitted videostream

$(document).ready(function(){

navigator.getUserMedia = ( navigator.getUserMedia ||navigator.mozGetUserMedia ||navigator.webkitGetUserMedia  ||navigator.msGetUserMedia);


if(navigator.getUserMedia){
  navigator.getUserMedia({ video: true, audio:true}, function(stream) {
    var video =  $('#video')[0];
   video.src = window.URL.createObjectURL(stream);
    video.muted=true;
    //$('#video').hide();
  },  function(){
    showMessage('unable to get camera', 'error');
  });
}else{
    showMessage('no camera access mate.', 'error');
}



function showMessage(msg,type) { // type 'success' or 'error'
    $('#msg').text(msg);
}

})

html代码：

<div id='msg' class'message'></div>
  <div >
    <video id='video' autoplay></video>
  </div>

推荐答案

您可以从视频元素中获取视频流原生分辨率一旦流通过onloadedmetadata附加到它。这不提供帧速率信息。

You can get video stream native resolution from the video element once the stream is attached to it via onloadedmetadata. This does not provide frame rate information.

  navigator.getUserMedia({ video: true, audio:true}, function(stream) {
    var video =  $('#video')[0];
    video.src = window.URL.createObjectURL(stream);
    video.muted=true;
    video.onloadedmetadata = function() {
      console.log('width is', this.videoWidth);
      console.log('height is', this.videoHeight);
    }
    //$('#video').hide();
  },  function(){
    showMessage('unable to get camera', 'error');
  });

按 W3C草案，流中的媒体轨道应提供此信息，但实际上浏览器尚未实现它。

Per the W3C draft, the media track within the stream should provide this information, but in practice browsers have yet to implement it.

getCapabilities（）方法返回对象支持的可约束属性的
名称字典。

The getCapabilities() method returns the dictionary of the names of the constrainable properties that the object supports.

这篇关于从MediaStream对象获取媒体详细信息（分辨率和帧速率）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！