如何从使用浏览器的网络音频捕获的较大音频中获取较小的音频 Api

How to get a smaller piece of audio from larger audio captured with browser's Web Audio Api

我正在制作一个 speech-to-text 工具。我正在实时捕获音频(使用来自 Chrome 的网络音频 api)并将其发送到服务器以将音频转换为文本。

我想提取整个音频的片段,因为我只想发送句子,避免静音。 (因为我使用的 api 是有成本的)。问题是我不知道如何将整个音频转换成片段。

我正在使用 MediaRecorder 来捕捉音频

    // recording 

    this.recorder = new MediaRecorder(stream)
    this.recorder.ondataavailable = async (e) => {
      const buffer = await e.data.arrayBuffer()
      this.chunks.add(new Uint8Array(buffer))
    }
    this.recorder.start(1000)

现在我在 this.chunks 中有一个按秒索引的缓冲区数组。
如果我尝试通过传递所有捕获的缓冲区来重现整个音频文件,它能够解码并正确重现它:

    // reproduce the whole audio: <- this works
    const combinedChunks = this.chunks.reduce((prev, chunk) => [...prev,...chunk], [])
    const arrChunks = new Uint8Array(combinedChunks)
    this.repAudioContext = new AudioContext()
    this.repAudioBuffer = await this.repAudioContext.decodeAudioData(
      arrChunks.buffer
    )

    this.repSourceNode = this.repAudioContext.createBufferSource()
    this.repSourceNode.buffer = this.repAudioBuffer

    this.repSourceNode.connect(this.repAudioContext.destination)
    this.repSourceNode.start()

行得通^,因为我正在使用所有的部分。 但是因为我想提取音频片段,所以我希望能够 select 只有我想重现的缓冲片段。我不能那样做。如果我提取第一段音频,它会停止工作,我会得到:decodeAudioData - Unable to decode audio data.

    // reproduce a part of the audio captured: <- this won't work
    const combinedChunks = this.chunks.slice(1).reduce((prev, chunk) => [...prev,...chunk], []) // <- skipping first chunk
    const arrChunks = new Uint8Array(combinedChunks)
    this.repAudioContext = new AudioContext()
    this.repAudioBuffer = await this.repAudioContext.decodeAudioData(
      arrChunks.buffer
    )

    this.repSourceNode = this.repAudioContext.createBufferSource()
    this.repSourceNode.buffer = this.repAudioBuffer

    this.repSourceNode.connect(this.repAudioContext.destination)
    this.repSourceNode.start()

我知道这可能是因为在第一个块中有 headers 或捕获音频的其他元数据。但是找不到这样做的方法。

谁能给我一些建议?我应该使用不同的 api 吗?从较大的音频中提取较小的音频片段以进行复制并另存为文件的正确方法是什么?

我找到了我自己问题的答案,我使用了错误的方法。

我需要使用 AudioWorkletProcessor 来获取原始音频输入并能够对其进行操作。

这个视频帮助我理解了背后的理论:

https://www.youtube.com/watch?v=g1L4O1smMC0

这篇文章帮助我了解了如何使用它:https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API/Using_AudioWorklet