如何将 mp3 blob 作为 post 请求发送？

Question

我有一个录音机，我需要将其作为第三方服务器中的 post 请求发送，因此它必须是 mp3。

我的 blob 日志： 尺寸：17981 类型：“音频/webm；编解码器=opus”

和我的代码：

  async function sendBlob() {
    const formData = new FormData();
    formData.append("audio-file", getBlob);
    const res = await fetch("/api/whisper", {
      method: "POST",
      // headers: {
      //   "Content-Type": `multipart/form-data`,
      // },
      body: formData,
    });
    const { result } = await res.json();
  }

我已经尝试创建一个 File() 和几乎所有内容，我需要将其作为 mp3 文件发送。

我尝试发送 blob，将其附加到 FormDat() 和 File() 中，我尝试发送 url，但发布请求仅接受 mp3 文件（如果我上传文件并发送它可以工作，但我想录音直接发送）

Answer 1

需要更多信息才能了解

getBlob

变量的内容，但是，我注意到有关代码的三件事：

1. 'audio-file' 是您调用的 API 所期望的参数名称，但几乎不会这样调用

2. 你错过了formData中的第三个参数，它是文件的名称

3. 更喜欢使用“音频/mpeg”作为您的 ContentType

使用 React、Axios、react-audio-voice-recorder 和调用 Python API 的示例：

第1步：设置你的react-audio-voice-recorder：

  import { AudioRecorder } from 'react-audio-voice-recorder';

  ...


  const YourComponent = () => {

  (...)

    return (
          <AudioRecorder
            onRecordingComplete={handleRecordingComplete}
            audioTrackConstraints={{
              noiseSuppression: true,
              echoCancellation: true,
            }}
            downloadOnSavePress={false}
          />
    );
  }

第 2 步： 设置您的

handleRecordingComplete

方法：

  const handleRecordingComplete = async (blob) => {
    const formData = new FormData();
    const axiosConfig = {
      headers: {
        Accept: 'audio/mpeg',
        'Content-Type': 'audio/mpeg'
      }
    };

    // file is the parameter name in the API (example in step 3)
    // blob is your blob file
    // 'audio.mp3' is the name you want your file to have
    formData.append('file', blob, 'audio.mp3');

    await axios.post(API_URL, formData, this.audioConfig)
      .then(async response => {
        const transcriptedText = response.data.response.transcript.text;
        console.log(transcriptedText);
      })
      .catch(exception => console.log(expection));
  };

第 3 步： 检查您的 API 代码（在我的例子中，在 Python 中，调用 openAI 来转录音频）：

async def transcript_audio(audio: BufferedReader) -> SingleQuestionResponse:
    env = get_dotenv()
    openai.api_key = env.get("OPENAI_API_KEY")
    transcript = openai.Audio.transcribe("whisper-1", audio)

    return {"transcript": transcript}


@router.post("/api/transcript")
async def post_transcript_audio (file: UploadFile)):
    with open(file.filename, 'wb') as buffer:
        buffer.write(file.file.read())

    audio = open(file.filename, 'rb')
    transcripted_audio = await transcript_audio(audio)

    return {'response': transcripted_audio}

JIT：对事物的命名要小心。

getBlob

给出了未调用方法的想法。仔细检查 API 中预期变量名称的名称，因为正如我所说，“音频文件”看起来不正确。