Skip to content

Instantly share code, notes, and snippets.

@Sleavely
Forked from javilobo8/download-file.js
Last active August 31, 2022 16:45
Show Gist options
  • Save Sleavely/b243e4400a9e4772b00128d3e99b9946 to your computer and use it in GitHub Desktop.
Save Sleavely/b243e4400a9e4772b00128d3e99b9946 to your computer and use it in GitHub Desktop.
Download files from Lambda with AWS Amplify
await API.get('myCloudApi', '/items', {
responseType: 'blob',
response: true
})
.then((response) => {
const blob = new Blob([response.data], { type: 'application/octet-stream' })
const filename = response.headers['content-disposition'].split('"')[1]
if (typeof window.navigator.msSaveBlob !== 'undefined') {
// IE workaround for "HTML7007: One or more blob URLs were
// revoked by closing the blob for which they were created.
// These URLs will no longer resolve as the data backing
// the URL has been freed."
window.navigator.msSaveBlob(blob, filename)
} else {
const blobURL = window.URL.createObjectURL(blob)
const tempLink = document.createElement('a')
tempLink.style.display = 'none'
tempLink.href = blobURL
tempLink.setAttribute('download', filename)
// Safari thinks _blank anchor are pop ups. We only want to set _blank
// target if the browser does not support the HTML5 download attribute.
// This allows you to download files in desktop safari if pop up blocking
// is enabled.
if (typeof tempLink.download === 'undefined') {
tempLink.setAttribute('target', '_blank')
}
document.body.appendChild(tempLink)
tempLink.click()
document.body.removeChild(tempLink)
window.URL.revokeObjectURL(blobURL)
}
})
@Sleavely
Copy link
Author

Or, in the case where you get base64 back from the API because you forgot the Accept header:

API.get('myCloudApi', `/items`, {
      responseType: 'arraybuffer',
      response: true
    })
      .then((response) => {
        const byteCharacters = atob(response.data)
        const byteNumbers = new Array(byteCharacters.length)
        for (let i = 0; i < byteCharacters.length; i++) {
          byteNumbers[i] = byteCharacters.charCodeAt(i)
        }
        const byteArray = new Uint8Array(byteNumbers)

        const blob = new Blob([byteArray], { type: 'application/octet-stream' })

        const filename = response.headers['content-disposition'].split('"')[1]

        if (typeof window.navigator.msSaveBlob !== 'undefined') {
          // IE workaround for "HTML7007: One or more blob URLs were
          // revoked by closing the blob for which they were created.
          // These URLs will no longer resolve as the data backing
          // the URL has been freed."
          window.navigator.msSaveBlob(blob, filename)
        } else {
          const blobURL = window.URL.createObjectURL(blob)
          const tempLink = document.createElement('a')
          tempLink.style.display = 'none'
          tempLink.href = blobURL
          tempLink.setAttribute('download', filename)

          // Safari thinks _blank anchor are pop ups. We only want to set _blank
          // target if the browser does not support the HTML5 download attribute.
          // This allows you to download files in desktop safari if pop up blocking
          // is enabled.
          if (typeof tempLink.download === 'undefined') {
            tempLink.setAttribute('target', '_blank')
          }

          document.body.appendChild(tempLink)
          tempLink.click()
          document.body.removeChild(tempLink)
          window.URL.revokeObjectURL(blobURL)
        }
      })

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment