JS視訊和音訊錄製
阿新 • • 發佈:2019-02-16
<body> <video autoplay></video> <a download="media" class="downloadButton">下載</a> <button class="recorderControl">錄製</button> </body> <script> var promise= navigator.mediaDevices.getUserMedia({video:true}); promise.then(function(stream){ var video=document.querySelector("video"); video.src = URL.createObjectURL(stream); var recorder=new MediaRecorder(stream); var recorderControl=document.querySelector(".recorderControl"); recorderControl.onclick=function(){ this.textContent=="錄製"?video.play():video.pause(); this.textContent=="錄製"?recorder.start():recorder.stop(); this.textContent=this.textContent=="錄製"?"停止":"錄製"; }; var buffers=[]; recorder.ondataavailable=function(event){ buffers=event.data; } var downloadButton=document.querySelector(".downloadButton"); recorder.onstop=function(){ var url=URL.createObjectURL(buffers); downloadButton.click(); buffers=null; }; }).catch(function(error){ console.log(error); }); // 音訊同理,只需改變標籤即可。 </script>