HTML5网络摄像头流不知怎么的坏了

Question

我有一个非常简单的javascript，从用户的网络摄像头流式传输内容到HTML5视频元素。在我今天开始之前，它工作得很好。我试图添加一个画布元素到同一页面，并在这样做添加了宽度和高度规格的视频元素，使视频和画布将是相同的大小。不知何故，这破坏了网络摄像头/视频，所以我恢复了更改…它还是坏的。

到目前为止，我已经尝试清除所有浏览器数据(我在Chrome中工作)，重新启动浏览器，重新启动计算机，并重新(和重新-，和重新-)上传文件，无济于事。我根本没有接触javascript，只是上面的html5，所以我怀疑这是html5的问题，但我是javascript的初学者，所以我知道什么?最初，由于我缺乏经验，我花了一段时间才实现这一功能，现在我在开发过程中倒退得更远了。我做了什么，我该如何补救?

下面是代码(注意:使用Modernizr处理getUserMedia的跨平台内容):

<div id="webapp_content">
    <h4>Webcam Test</h4>
    <p>
    <div id="video_container">
        <video id="video_element" autoplay="true"></video>
    </div>
    <script>
    var video = document.querySelector('#video_element');
    if (Modernizr.getusermedia) {
        var gUM = Modernizr.prefixed('getUserMedia', navigator);
        gUM({video: true}, videoInit, videoError);
    }
    function videoInit(stream) {
        video.src = window.URL.createObjectURL(stream);
    }
    function videoError(e) {
        alert('Error! getUserMedia not available!', e);
    };
    </script>
    <p> 
</div>

Answer 1

问题实际上出在Modernizr脚本上:很明显，从现在到我开始使用Modernizr的时候，Modernizr的人把他们代码中的getusermedia部分变成了非核心，因此没有包含在他们的标准下载中。

我不确定这是最初的问题，还是我下载了最新版本的Modernizr在原来的基础上产生了另一个问题，但是从方程中删除Modernizr解决了这个问题。我现在又有了一个工作的网络摄像头流-尽管只是在Chrome中。我以后再考虑跨平台的东西。