Download zip folder with REST request in javascript. React.js

Question

I am sending request to download zip folder from server, which is sending me below response - (Zip folder in bytes)

PK�s�H  test.txt~���T*-N-R�R*I-.Q���PK�/[�PK�s�Htest.txt���T*-N- R�R*I-.Q���PK�/[�PK�s�H�/[�    test.txt~PK�s�H�/[�Ltest.txtPKm�

In react I have written below function to download the zip folder.I am getting error while extracting zip folder.

   downloadUtmFile: function() {
      function download(text, name, type) {
        var a = document.createElement("a");
        var file = new Blob([text], {type: type});
        a.href = URL.createObjectURL(file);
        a.download = name;
        a.click();
     }
        DashboardStore.downloadFile(API_ENDPOINT.utmFileDownload).then(function(result) {
        download(result,'', 'application/zip');
    }.bind(this), function(error) {
        this.setState({
            message: error
        });
    }.bind(this));
},

I am using Blob and passing it type as "application/zip" While extracting the zip folder it is throwing me error.

Palatinate

what error is thrown? – Duplessis

@JohannesReuter An error occurred while loading archive. While extracting zip folder. – Palatinate

I'm guessing text is a string, it needs to be a binary data type. – Dykstra

@Dykstra : test.txt is file inside that zip folder. – Palatinate

text as in download(text, name, type) – Dykstra

Answer 1

I think this is the header's problem. Need to add the following thing in the request header,

{
  "content-type": "application/zip",
  responseType: "blob",
}

Distefano