I can successfully upload audiofiles to AWS S3, however the files do not play whether downloaded or played in the browser. The files do have a filesize.

I'm uploading an audioBlob object to AWS S3:

const [audioBlob, setAudioBlob] = useState(null)


const submitVoiceMemo = async () => {
    try {
      await fetch('/api/createVoiceMemo', {
        method: 'PUT',
        body: audioBlob
      })
    } catch (error) {
      console.error(error)
    }
  }

This is the API Route:

module.exports = requireAuth(async (req, res) => {
  try {
    AWS.config.update({
      accessKeyId: process.env.AWS_ACCESS_KEY_1,
      secretAccessKey: process.env.AWS_SECRET_ACCESS_KEY_ID,
      region: 'us-east-2',
      signatureVersion: 'v4'
    })

    const s3 = new AWS.S3();

    const uuid = randomUUID()
    const s3Params = {
      Bucket: 'waveforms',
      Key: `voicememo/${uuid}.mp3`,
      Body: req.body,
      ContentType: 'audio/mpeg',
      ACL: 'public-read'
    }

    await s3.upload(s3Params).promise()

  } catch (e) {
    res.status(500).json({ error: e.message })
  }
})

As per this question, I have confirmed that req.body is a string.

The file being received by S3 has a filesize and the correct contentType when checked in the S3 console. It just isn't playable when downloaded or played directly in the browser.

Below is how audioBlob and also audioFile (an MP3) are generated (Basically the user records a voice memo and when they click stopRecording, raw audio is stored as state):

const [audioBlob, setAudioBlob] = useState(null)
const [blobURL, setBlobUrl] = useState(null)
const [audioFile, setAudioFile] = useState(null)

const stopRecording = () => {
    recorder.current
      .stop()
      .getMp3()
      .then(([buffer, blob]) => {
        const file = new File(buffer, 'audio.mp3', {
          type: blob.type,
          lastModified: Date.now()
        })
        setAudioBlob(blob)
        const newBlobUrl = URL.createObjectURL(blob)
        setBlobUrl(newBlobUrl)
        setIsRecording(false)
        setAudioFile(file)
      })
      .catch(e => console.log(e))
  }

How can I correctly store audio generated on the front-end, in S3?