Saturday, 22 May 2021

Audio Record Problem in JavaScript some of the recording is missing

Hello Everyone I am trying to Record Audio and then after Recording I play it and when I hit the Cut function it just get the second I am on it in the player and cut to the end and start recording again and then overwrite the chunks array till the end with the new recording to sum up all of that all I need is when I record 5 seconds and then I want to overwrite the last 3 seconds so I remove the last 3 elements in the array and push the new chunks to the original array when I do that and send the new chunk to the audio player it plays the first time as intended and if I pressed play again it just plays the newly recorded part only without the first 2 seconds that I preserved from the old recording

let audioChunks = [];
let Recorder = null;
const recordAudio = () => {
    return new Promise(resolve => {
        navigator.mediaDevices.getUserMedia({ audio: true })
            .then(stream => {
                const mediaRecorder = new MediaRecorder(stream);
                mediaRecorder.addEventListener("dataavailable", event => {
                    audioChunks.push(event.data);
                });

                const start = () => {
                    mediaRecorder.start(1000);
                };

                const stop = () => {
                    return new Promise(resolve => {
                        mediaRecorder.addEventListener("stop", () => {
                            const audioBlob = new Blob(audioChunks,{type: 'audio/mpeg-3'});
                            const audioUrl = URL.createObjectURL(audioBlob);
                            const audio = new Audio(audioUrl);
                            document.getElementById("AudioRecodingPlayer").src = audio.src;
                            document.getElementById("AudioRecodingPlayer").currentTime = 0;
                            const play = () => {
                                audio.play();
                            };

                            resolve({ audioBlob, audioUrl, play });
                        });

                        mediaRecorder.stop();
                    });
                };

                resolve({ start, stop });
            });
    });
};

async function StartRecording(){
    Recorder = await recordAudio();
    Recorder.start();
}

async function StopRecording(){
    const audio = Recorder.stop();
}
function Cut(){
    var Audio = document.getElementById("AudioRecodingPlayer");
    var CurrenTime = Math.round(Audio.currentTime);
    audioChunks.length = CurrenTime;
    StartRecording();
}


from Audio Record Problem in JavaScript some of the recording is missing

1 comment:

  1. I have been looking for articles on these topics for a long time. I don't know how grateful you are for posting on this topic. Thank you for the numerous articles on this site, I will subscribe to those links in my bookmarks and visit them often. Have a nice day
    Do check
    Paypal Login
    gemini login

    ReplyDelete