javascript - 在 flask 后端保存音频

标签 javascript python flask audio

在前端,我有一个音频Blob,尝试将其发送到Flask后端,在该后端需要对音频进行一些处理。
目前,我将音频作为base64字符串发布到Flask。然后在Flask中,我将字符串编码为base64,然后尝试将其保存到本地文件系统中。它被保存为webm文件,但是,当我尝试播放音频时,即使base64字符串已保存到文件中,也为0秒。
您知道为什么音频可能无法正常播放吗?如何使音频在后端正常播放?
前端:

mediaRecorder.addEventListener("stop", () => {
      const audioBlob = new Blob(audioChunks, { 'type' : 'audio/webm'});
      const reader = new FileReader();
        reader.readAsDataURL(audioBlob);
        reader.onload = () => {
          const base64AudioMessage = reader.result.split(',')[1];
          console.log(reader.result)
          fetch("http://localhost:5000/api/audio", {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify({ message: base64AudioMessage })
          }).then(res => 
            {console.log(res)});
        }
    })
后端:
@app.route('/api/audio', methods=['POST'])
def audio():
    content = request.get_json(silent=True)
    print(type(content["message"])) #This is type string
    ans = base64.b64encode(bytes(content["message"], 'utf-8'))
    print(type(ans)) #This is type bytes
    with open("audioToSave.webm", "wb") as fh:
        fh.write(base64.b64decode(ans))
    theAnswer = 'no'
    return theAnswer

最佳答案

我不认为您应该将音频文件上传为base64,如果仅发送不带任何额外元数据,字段或json的数据,则将其上传为原始数据会大33%,否则请使用FormData

mediaRecorder.addEventListener("stop", () => {
  const audioBlob = new Blob(audioChunks, { 'type' : 'audio/webm'})
  fetch(url, { method: 'POST', body: audioBlob })
})

// or

mediaRecorder.addEventListener("stop", () => {
  const fd = new FormData()
  const audioBlob = new Blob(audioChunks, { 'type' : 'audio/webm'})
  fd.set('file', audioBlob, 'audioToSave.webm')
  fetch(url, { method: 'POST', body: fd })
})
您将节省内存和资源,避免对其进行编码和解码

关于javascript - 在 flask 后端保存音频,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62487798/

相关文章:

Python Pandas 对奇数数据帧进行排序

python - 在 Heroku 上找不到 parse_rest 模块,但在 localhost 上工作

javascript - 悬停效果与 jQuery 影响容器 div

python - 像 python 这样的动态语言能给你带来什么?来自 c#/java 背景。给我亮光!

javascript - 如何使用 dom 选择器作为对象中的值来迭代对象,然后使用它们来设置值?

python - 从发送模型中调用 django post_save?

mysql - SQLAlchemy 类 _MatchType(sqltypes.Float,sqltypes.MatchType): AttributeError

python - 成功安装flask,仍然出现导入错误

javascript - 显示选择 5 星级

javascript - ES6 将数组映射到不带逗号的字符串