Nikhil Nanjappa
Nikhil Nanjappa

Reputation: 6642

Axios GET - corrupt data downloading raw binary zip

Issue description

I have an endpoint which returns binary raw zip data. When I consume this endpoint via Postman and "Save to file", the downloaded zip file gets extracted just fine no issues. If I hit the endpoint on browser as well it downloads the zip & extracts with no issues. So, there is no issue with the binary raw data itself.

BUT when I try to download via Axios, I get below error while extracting the zip file. After a lot of digging, I've narrowed it down to some bytes being missing (Corrupted zip: missing 26 bytes) for some reason which points to me not using the right Axios config to properly transform, encode the binary data.

I've been trying all possible config changes (responseType as stream/arraybuffer/blob, responseEncoding as null/utf8/binary etc) still doesn't seem to fix the corrupt file!

Error

Whenever I try to unzip the file, I get the error:

Unable to expand "test.zip" (Error 79 - Inappropriate file type of format)

If I set the header with Content-Length, then I get this error while unzipping:

Unable to expand "test.zip" (Error 1 - No such process)

PS: I have another endpoint which returns raw binary PDF data and Axios downloads that perfectly fine! Its just an issue with raw binary ZIP data by the looks of it.

Code

// handling the axios request
getZipFile: ({}) => Axios.get('/zipfile, { params: {...} }, {
  responseType: 'arraybuffer',
  responseEncoding: null,
  maxContentLength: 20000,
  transformResponse: data => data,
})

// handling the axios response
const { data, headers = {} } = await getZipFile({})
console.log(data) // returns corrupted raw binary zip data

res.setHeader('Content-Type', 'application/zip');
res.setHeader('Content-Disposition', 'attachment; filename="test.zip"');
return res.end(data);

Versions

Upvotes: 0

Views: 809

Answers (1)

Nikhil Nanjappa
Nikhil Nanjappa

Reputation: 6642

I found the issue. Posting the answer here just in case others are facing the same problem.

Axios.get apparently only takes 2 arguments (url and config). Since Axios.post takes in 3 arguments (url, data and config) - I was under the impression GET would be the same but I was mistaken.

So the correct version of the above code is:

// handling the axios request
getZipFile: ({}) => Axios.get('/zipfile, {
  params: {...},
  responseType: 'arraybuffer'
})

Basically, params and responseType is at the same level within the config. The other configs like responseEncoding etc were not needed.

Upvotes: 0

Related Questions