Downloading large files with axios-CodePudding

I am currently downloading large files to my client code using the axios lib. Files are around 600MB. But during the download process the page crashes, like it runs out of memory or similar.

I need to hold the file in the memmory because the content is encrypted and I need to decrypt it before passing it to the user.

I use the REST GET Http request like this:

  axios.get(url, {
            headers: { 
                "Authorization": authHeader().Authorization,
                "Accept" : "application/octet-stream, application/json, text/plain, */*"            
            },   responseType: 'arraybuffer'

          })
          .then(function(response) {
          console.log(response);

Are there any common workaround around the problem. So far I wasn't able to find any.

CodePudding user response：

Do you actually need to do it with axios? There is the Fetch API, which can serve the purpose. Here's how I do it for files in the same size range as yours (media files and ZIPs of up to 1 GB):

        fetch(url, {
            mode: 'no-cors', // to allow any accessible resource
            method: 'GET',
        })
            .then((response) => {
                console.debug('LOAD_FROM_URL::response', response);
                //NOTE: response URL is possibly redirected

See https://github.com/suterma/replayer-pwa/blob/main/src/store/actions.ts for more context.

It's working flawless so far for me.

CodePudding user response：

Can you please give a try by setting maxContentLength and maxBodyLength to Infinity in the axios call.

axios.get(url, {
  headers: { 
    "Authorization": authHeader().Authorization,
    "Accept" : "application/octet-stream, application/json, text/plain, */*"            
  },
  responseType: 'arraybuffer',
  maxContentLength: Infinity,
  maxBodyLength: Infinity
})
  .then(function(response) {
  console.log(response);
}

You can also have a look into this axios issue forum for the same.