无法播放数据库中存储的缓冲区中的音频

问题描述

我已经花了2天的时间处理此事，但找不到解决方案，但好像我正在接近。目标是在浏览器中记录音频并将其存储在数据库中，并在需要时获取它。

我将音频编码为base64，然后将其发送到mongodb中以二进制形式存储的服务器，创建了一条get路由，在其中我通过id查找音频，并通过res.send（）和内容类型集发送缓冲区到音频/ 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',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);
    }
})

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）