Home > Software engineering >  how to upload a Recorded Audio(Blob) to server ? - ReactJS
how to upload a Recorded Audio(Blob) to server ? - ReactJS

Time:09-14

I'm Using react-media-recorder library and what i need to do is to send the voice as file to backend. and backend only supports mp3 and ogg how should i do this ? I Really need some help and I will appreciate some help

  const { startRecording, stopRecording, mediaBlobUrl } = useReactMediaRecorder(
    {
      audio: true,
      blobPropertyBag: { type: "audio/mp3" },
    }
  );

  React.useEffect(() => {

    async function uploadVoice() {
      const audioBlob = await fetch(mediaBlobUrl).then((r) => r.blob());
      const audiofile = new File([audioBlob], "audiofile.mp3", {
        type: "audio/mp3",
      });
      const formData = new FormData();
      formData.append("file", audiofile);
      await axios.post(
        endPoint,
        formData,
        {
          "content-type": "multipart/form-data",
        }
      );

    }
    if (mediaBlobUrl) {
      uploadVice();
    }

  }, [mediaBlobUrl]);

my implemention is not working and backend won't accept that I also changed mp3 to ogg and that didn't work too. How should I Upload blob to server?

CodePudding user response:

The mime type should be audio/mpeg for .mp3 files, not audio/mp3.

  • Related