Why is the zip file corrupted after downloading?

Question

Django

I'm trying to give the user a zip file for downloading. Front - vue.js, back - django rest.
So I wrap a zip file on the back:

return FileResponse(open('static/Letters.zip', 'rb'), content_type='application/zip')

So trying to get it on the front:

axios.post('http://127.0.0.1:8000/api/create_letter_to_the_debtor', JSON.stringify(body))
      .then(
        function (response) {
          let blob = new Blob([response.data],)
          let link = document.createElement('a')
          link.href = window.URL.createObjectURL(blob)
          link.download = 'Letters.zip'
          link.click()})
      .catch(e => {
        console.log(e.response)
      });

but when I download the zip file I get this error:

What is the problem or what am I doing wrong?

Answer 1

solved the problem, peeped Here , you need to change:

axios.post('http://127.0.0.1:8000/api/create_letter_to_the_debtor', JSON.stringify(body))
      .then(
        function (response) {
          let blob = new Blob([response.data],)
          let link = document.createElement('a')
          link.href = window.URL.createObjectURL(blob)
          link.download = 'Letters.zip'
          link.click()})
      .catch(e => {
        console.log(e.response)
      });

On the:

axios({
        method: 'POST',
        url:'http://127.0.0.1:8000/api/create_letter_to_the_debtor',
        data: JSON.stringify(body),
        responseType: 'blob',
      })
      .then( (response) => {
        // response => console.log(response))
          console.log(response)
          let blob = new Blob([response.data], { type: 'application/zip' })
          let link = document.createElement('a')
          link.href = window.URL.createObjectURL(blob)
          document.body.appendChild(link);
          link.click()
          document.body.removeChild(link);
        })