[Vuejs]-Trouble downloading mp3 files from S3 using Amplify/Node

by

0👍

I ended up using a combination of this answer:
https://stackoverflow.com/a/36894564

and this snippet:
https://gist.github.com/javilobo8/097c30a233786be52070986d8cdb1743

So the file gets downloaded in the response data(result), I added more meta data tags to the files to get the file name and title. Finally adding the link to the DOM and executing a click() on it saves the file named correctly. Full solution below:

getFile (fileKey) {
      Storage.get(fileKey, {download: true}).then(result => {
        console.log(result)
        let mimeType = result.ContentType

        let fileName = result.Metadata.filename
        if (mimeType !== 'audio/mp3') {
          throw new TypeError("Unexpected MIME Type")
        }

        try {
          let blob = new Blob([result.Body], {type: mimeType})

          //downloading the file depends on the browser
          //IE handles it differently than chrome/webkit
          if (window.navigator && window.navigator.msSaveOrOpenBlob) {
            window.navigator.msSaveOrOpenBlob(blob, fileName)
          } else {
            let objectUrl = URL.createObjectURL(blob);
            let link = document.createElement('a')
            link.href = objectUrl
            link.setAttribute('download', fileName)
            document.body.appendChild(link)
            link.click()
            document.body.removeChild(link)
          }
        } catch (exc) {
          console.log("Save Blob method failed with the following exception.");
          console.log(exc);
        }

      })
  }
}

Leave a comment