Доброго времени суток! В примере ниже мы сделаем с Вами простейший диктофон на JavaScipt .

Делаем диктофон на JavaScript

Доброго времени суток! В примере ниже мы сделаем с Вами простейший диктофон на JavaScipt.

Пример кода:


document.addEventListener('DOMContentLoaded', () => {

    const startButton = document.querySelector('#record');
    const stopButton = document.querySelector('#stop');
    const audio = document.querySelector('#audio');

    startButton.addEventListener('click', async () => {

        // получаем поток с микрофона
        const stream = await navigator.mediaDevices.getUserMedia({ audio: true, video: false });

        // создаем объект, который будет отвечать за запись аудио
        const mediaRecorder = new MediaRecorder(stream);

        // начинаем запись
        mediaRecorder.start();

        // массив, который будет содержать части записанного аудио
        const  chunks = [];
        mediaRecorder.ondataavailable = (e) => {
            chunks.push(e.data);
        }

        // ловим ошибки
        mediaRecorder.onerror = (e) => {
            alert(e.error);
        }

        mediaRecorder.onstop = (e) => {
            const blob = new Blob(chunks);

            // создаем объект URL для тега аудио
            const url = URL.createObjectURL(blob);

            // записываем url из памяти в аттрибут src тега audio 
            audio.src = url;
        }


        // при клике на кнопку останавливаем запись
        stopButton.addEventListener('click', () => {
            mediaRecorder.stop();
        })
    })
});

Вот таким образом можно сделать простой Диктофон в JavaScript.