如何使用getUserMedia获取网络摄像头图像的大小？

Question

我试图找出使用getUserMedia从网络摄像头获得的图像大小.

现在,在我的Macbook中,我认为是720p相机,但我得到的图像是640x480.我假设情况并非总是如此,我希望能够处理尽可能多的相机.(我更关心纵横比而不是尺寸本身,我只是想确保图片不显示拉伸)

是否有可能做到这一点？

谢谢!
丹尼尔

Answer 1

您应该能够使用videoWidth和videoHeight属性,如下所示:

// Check camera stream is playing by getting its width
video.addEventListener('playing', function() {
    if (this.videoWidth === 0) {
        console.error('videoWidth is 0. Camera not connected?');
    }
}, false);

更新:实际上,这适用于Opera,但似乎不再支持Chrome,并且还没有在Firefox中实现(至少不适用于视频流).不过,这是在HTML5规范中,所以希望这些浏览器的路线图.

更新2:这确实有效,但是要监听的事件是"正在播放"而不是"播放"(在上面的代码中修复).play()返回方法时会触发"play"事件,而实际开始播放时会触发"播放"事件.在Opera,Chrome和Firefox中测试过.

更新3:Firefox 18似乎反复触发"播放"事件,这意味着如果您在侦听器中执行大量代码,浏览器可能会停止运行.最好在触发后删除侦听器,如下所示:

var videoWidth, videoHeight;
var getVideoSize = function() {
    videoWidth = video.videoWidth;
    videoHeight = video.videoHeight;
    video.removeEventListener('playing', getVideoSize, false);
};

video.addEventListener('playing', getVideoSize, false);