如何记录用户网络摄像头?

时间:2013-06-27 08:11:33

标签: javascript webrtc

单击“录制”按钮时,Webcam会启动,但是当您单击“停止”按钮时,没有任何反应

我现在有这个但我不确定它是否录音?我怎么知道它的录音以及如何重新显示录制的视频?

<html>
<input type="button" value="Record" onclick="record(this)">
<input type="button" value="Stop" onclick="stop(this)">
<video autoplay></video>
<script language="javascript" type="text/javascript">



var record = function(button) {
navigator.getUserMedia = navigator.webkitGetUserMedia 
|| navigator.getUserMedia;

window.URL = window.URL || window.webkitURL;

navigator.getUserMedia({audio: true, video: true}, function(stream) {
  var video = document.querySelector('video');
  video.src = window.URL.createObjectURL(stream);
  stream.record();
  //setTimeout(stop, 10);
}, function(e) {
  console.log(e);
  //setTimeout(10);
});
};

var stop = function(button){
//alert('Checking');
stream.stop();
stream.getRecordedData(function(blob) {
alert('Checking');
//upload blobusing XHR2.
});
};


</script>
</html>

1 个答案:

答案 0 :(得分:0)

stop函数中,范围内没有变量stream。您在上面调用stream.record()的对象是那里的匿名函数的参数,现在无法访问。

很高兴您可以轻松解决此问题 - 只需“保存”对顶级变量的引用,如下所示:

var currentStream = null;

var record = function(button) {
    ...
    stream.record();
    currentStream = stream;
    ..
}

var stop = function(button) {
    currentStream.stop(); // TODO disable stop button if this is null, etc.
    ...
}

顺便说一句,当你使用Javascript时,你应该在你正在使用的任何浏览器中注意错误控制台。你几乎肯定会看到一个错误,比如“stream is null or not a object [line 28]”,它会告诉你那里的问题是什么。