1

録画ボタンをクリックするとウェブカメラが起動しますが、停止ボタンをクリックしても何も起こりません

私は今これを持っていますが、それが録音されているかどうかわかりませんか? 録画されているかどうかを確認する方法と、録画したビデオを再表示するにはどうすればよいですか?

<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>
4

1 に答える 1

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 an object [line 28]" のようなエラーが表示され、何が問題なのかがわかります。

于 2013-06-27T09:27:40.577 に答える