我正在尝试编写一个可以在浏览器中录制视频并将其上传到服务器的小型应用程序。
我有以下代码：
<html>
<body>
<video id="video" playsinline autoplay></video>
<script>
function hasGetUserMedia() {
return !!(navigator.mediaDevices &&
navigator.mediaDevices.getUserMedia);
}
if (hasGetUserMedia()) {
console.log("Good to go");
} else {
console.log('Not supported');
}
const constraints = {
video: true,audio: true,};
function start(){
navigator.mediaDevices.getUserMedia(constraints).
then((stream) => {video.srcObject = stream});
var videoEl = document.getElementById('video');
stream = videoEl.srcObject;
}
function stop(){
var videoEl = document.getElementById('video');
stream = videoEl.srcObject;
tracks = stream.getTracks();
tracks.forEach(function(track) {
track.stop();
});
downloadLink.href = URL.createObjectURL(new Blob(tracks[0]));
downloadLink.download = 'acetest.webm';
}
</script>
<button onclick="start()">Start</button>
<button onclick="stop()">Stop</button>
</body>
我可以在屏幕上看到视频，但是不确定如何将其捕获到要上传的文件中。
我尝试使用URL.createObjectURL(new Blob(tracks[0]));，但这不起作用。按下“停止”按钮后如何保存视频？