Блог

Я потратил 2 дня на эту штуку и не смог найти решение, но, похоже, я приближаюсь. Цель состоит в том, чтобы записать аудио в браузере и сохранить в базе данных и получать его всякий раз, когда мне это нужно.

Я закодировал аудио в base64 и отправил его на сервер, сохраненный в виде двоичного файла в mongodb, создал маршрут получения, в котором я нахожу аудио по идентификатору и отправляю буфер через res.send() вместе с типом содержимого, установленным в audio / webm (тип mime по умолчанию)

но дело в том, что я получаю это пустое видео, похоже, он не знает, как его декодировать или что-то в этом роде. Возможно, что-то не так с типом содержимого.

 navigator.mediaDevices.getUserMedia({ audio: true, video: false })
    .then((mediaRecorderObj) => {
        let mediaRecorder = new MediaRecorder(mediaRecorderObj, { mimType: 'audio/webm;base64' })
        const m = mediaRecorder;
        let chunk = []
        startBtn.addEventListener('click', () => {
            mediaRecorder.start()
            console.log('started recording..');
        })
        endBtn.addEventListener('click', () => {
            mediaRecorder.stop()
            console.log('just stopped recording');
        })
        //-----When Data Is Available
        mediaRecorder.ondataavailable = (e) => {
            chunk.push(e.data);
        }

        //--------When finished adding it to chunk
        mediaRecorder.onstop = () => {
            const blob = new Blob(chunk, { 'type': 'audio/webm' })
            chunk = []
            const reader = new FileReader()
            reader.readAsDataURL(blob)
            reader.onloadend = async () => {
                const buffer = reader.result
                const bodyObj = {
                    voice: buffer
                }
                await fetch('http://localhost:3000/upload-spoken-bio', {
                    method: 'post',
                    body: JSON.stringify(bodyObj),
                    headers: { 'Content-Type': 'application/json' }
                })
            }
        }
    })

  

и это на стороне сервера

 //----------Upload
spokenBio.post('/upload-spoken-bio', async (req, res) => {
    const buffer = req.body
    try {
        const newBuffer = new SpokenCon(buffer)
        await newBuffer.save()
    }
    catch (err) {
        console.log(err.message);
    }
})

//----------Retrieve
spokenBio.get('/get-spoken-bio/:id', async (req, res) => {
    const id = req.params.id
    try {
        const field = await SpokenCon.findById(id)
        const binary = field.voice
        res.set({ 'Content-Type': 'audio/webm' })
        res.send(binary)
    }
    catch (err) {
        console.log(err.message);
    }
})