Mi aplicación de grabación me está dando el siguiente error:

blob:https://theharnishes.com/f86f14a7-53cf-4d21-a137-deb145c95b73:1 Error al cargar el recurso: net::ERR_REQUEST_RANGE_NOT_SATISFIABLE

Puedes ver tres botones. REPRODUCIR, GRABAR y DETENER LA GRABACIÓN. Por su contexto, debemos saber qué botón hace qué. Cuando hice clic en el botón GRABAR, no se muestra nada en la consola. Cuando hice clic en DETENER LA GRABACIÓN, primero, la consola registra mi conjunto de fragmentos de audio y luego el mensaje de error. Finalmente, cuando hice clic en el botón PLAY, apareció otro error extraño:

No capturado (en promesa) DOMException: el elemento no tiene fuentes compatibles.

Este error lo entiendo. Porque he solicitado el dispositivo de video en lugar del dispositivo de audio. Más tarde cambié navigator.mediaDevices.getUserMedia({video:true}) a {audio:true} . Volví a mi página web y el último error no desapareció. Quiero que la aplicación reproduzca el audio grabado cuando se haga clic en el botón PLAY.

Ejemplo en vivo (asegúrese de permitir el uso de su micrófono). _{Está subcontratado, porque Stack Snippets no permite el uso de getUserMedia .}

 var recordedChunck = []; var audio_play; var audioRecorder; function record() { document.getElementById("record_message").innerHTML = "Recording..."; navigator.mediaDevices.getUserMedia({ audio: true }) .then(function(data) { audioRecorder = new MediaRecorder(data); audioRecorder.start(); audioRecorder.addEventListener('dataavailable', function(event) { recordedChunck.push(event.data); console.log(recordedChunck); }); }).catch(function(error) { console.log(error); }); } function Stop() { audioRecorder.stop(); var blob = new Blob(recordedChunck); var audioUrl = URL.createObjectURL(blob); audio_play = new Audio(audioUrl); } function play() { audio_play.play(); }

 <p id="record_message"> </p> <button onclick="record()" style="color:blue; font-size:16px;"> RECORD </button> <button onclick="Stop()" style="color:blue; font-size: 16px;"> STOP RECORDING </button> <button onclick="play()"> PLAY </button>