Java 脚本中的录音

Audio Recording in Java Script

我知道这是一个常见问题,但出于某种原因,有几个答案(这让我很困惑)

tl;博士 我正在尝试设置一个按钮,让您最多录制 10 秒(如果您想在此之前停止录制,可以按停止) 然后让你玩。


到目前为止我尝试过的:

我知道有库 getUserMedia,我已经(尝试)创建了一个 MediaStream。 当谈到录音本身和 the.Start() 和 Stop()

时,我感到困惑

这是我获取用户访问麦克风权限的代码:

const getmiceacesses = function () {
const stream = navigator.mediaDevices
.getUserMedia({ audio: true })
.then(function (stream) {const mediaRecorder = new MediaRecorder(stream);
  const audioChunks = [];

  mediaRecorder.addEventListener("dataavailable", (event) => {
    audioChunks.push(event.data);
  });
});};

const recording = document.querySelector(`.recorder`);
recording.addEventListener(`click`, getmiceacesses);

谢谢大家!

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
</head>
<body>
    <audio id='audioPlayer'></audio>

    <button type="button" class="recorder">Start</button>
    <button type="button" class="stopRecorder">Stop</button>
    
    <script>
        function playAudio(audioChunks) {
          const blob = new Blob(audioChunks,{type:'audio/x-mpeg-3'});
          const audioPlayer = document.getElementById('audioPlayer')
          audioPlayer.src = URL.createObjectURL(blob);
          audioPlayer.controls=true;
          audioPlayer.autoplay=true;
        }

       var mediaRecorder; // Need to be accessible for the stopRecorder function
       const audioChunks = []; // Place it here to debug it contents after finsih recording

        const getmiceacesses = function () {
        const stream = navigator.mediaDevices.getUserMedia({ audio: true })
        .then(function (stream) {
            mediaRecorder = new MediaRecorder(stream);
 
             mediaRecorder.start();

             setTimeout(stopRecorder, 10000) // To automatically stop the recorder after 10 seconds
 
            mediaRecorder.addEventListener("dataavailable", (event) => {
                audioChunks.push(event.data);
                playAudio(audioChunks)
                console.log('Debugging Breakpoint')
            });
        })
      ;};

             
     const stopRecorder = function(){
         if(mediaRecorder.state === 'recording'){
            mediaRecorder.stop();
         }
     }

     const recording = document.querySelector('.recorder');
     recording.addEventListener('click', getmiceacesses);

     const stopRecording = document.querySelector('.stopRecorder');
     stopRecording.addEventListener('click', stopRecorder);
    </script>
</body>
</html>