Trying to send a zip from the backend to the frontend

Related searches

At one point in my ember.js webapp the user is given the option to download a zip file. On clicking the button, an action is triggered that sends a request to the backend server, which generates the zip and returns it. Ideally the zip should then be downloaded automatically.

In my backend endpoint I return with

return Response
        .ok(FileUtils.readFileToByteArray(new File(tmpZipFilename))) // tmpZipFilename is a String
        .type("application/zip")
        .header("Content-Disposition", "attachment; filename=\"" + finalZipFilename + "\"")
        .build();

In the frontend I have (adapted from here)

submit() {
  var formData = new FormData(this);
  let token = this.get('session.data.authenticated.token');
  jquery.ajax({
    url: `myUrl`,
    data: formData,
    processData: false,
    contentType: false,
    beforeSend: function(xhr) {xhr.setRequestHeader('Authorization', `Bearer ${token}`)},
    type: 'POST',
    success: function(data) {
      var blob = new Blob([data], {type: 'application/zip'});
      let a = document.createElement("a");
      a.style = "display: none";
      document.body.appendChild(a);
      let url = window.URL.createObjectURL(blob);
      a.href = url;
      a.download = 'myFile.zip';
      a.click();
      window.URL.revokeObjectURL(url);
    },
    failure: function() {
      // other stuff
    }
  })
}

The response headers are the following:

HTTP/1.1 200 OK
X-Powered-By: Undertow/1
Cache-Control: no-store
Date: Tue, 19 Feb 2019 16:34:35 GMT
Server: WildFly/10
Content-Type: application/zip
Content-Disposition: attachment; filename="filename.zip"
Connection: close
Transfer-Encoding: chunked

I have confirmed that tmpZipFilename in the backend section does correctly point to a proper zip file. And when the user clicks the download button a file called myFile.zip is indeed downloaded. However, the file downloaded is not unzippable and is a different size than the correct file pointed to by tmpZipFilename. What am I doing wrong?

The answer was to simply add dataType: 'arraybuffer':

...
jquery.ajax({
    url: 'myUrl',
    data: formData,
    processData: false,
    contentType: false,
    dataType: 'arraybuffer',
    beforeSend: function(xhr) {
...

Create Zip Files with JavaScript, library that allows you to easily generate ZIP files from the front-end. Let's have a look at how JSZip allows you to generate structured Zip files var zip = new JSZip(); // Add an top-level, arbitrary text file with How can I tweak this such that instead of downloading zip, I can just create the zip and send it� Iam trying to use the UploadCollection with ajax in order to send files through a post request, but for some reason, the file get's uploaded but it can never be open o visualize since the file seems to arrive broken in the backend (sap gateway) side. This is the way I'm getting the file using the UploadCollection

Actually to download files the best solution is to just call window.open.

React - How to serve big zip file sent by API as byte array, The frontend is a react app, a POST call give the back-end the list of files. of this topic : Spring REST - create .zip file and send it to the client I've tried to put the� I'm using a cheap Amazon instance (m1.small, Ubuntu 12.04) to host the frontend, but I only want to launch a backend instance when needed (the computations are heavy and require a powerful - and expensive - instance). I can use boto to programmatically launch a backend instance, but after that how do I feed the user input into the backend?

IF your API is returning an actual file, and you have the content type and disposition set correctly, you can just create a natural link in the frontend to the api endpoint, or use a standard form and not an AJAX request, as the file download will trigger and you will stay in the same place as far as the widow is concerned.

For option one:

<a href="<API_ENDPOINT>?token=<token>&param1=something&param2=something">download</a>

This can work by binding the parameters to the url string. However I would advise against this method unless you have a way to create SIGNED SINGLE USE GET AUTHENTICATION TOKENS as you should never be sending access tokens anywhere readable.

Option 2 is to create a generic HTML form where the action is the api endpoint, where you can pass the token in post data. If you API endpoint simple returns a proper file, when the form is submitted the file should download, and you should be able to stay on the same page.

<form action="<API ENDPOINT>" method="post">
  <!-- Standard input types named appropriately
</form>

These are just a couple of solutions. I personally like option 1 but only if you can get it working securely. Research HMAC auth methods to create this single use token if you can store and manage a nonce of some kind on the back end. Works well with JWTs.

[AF] In Flask, is it possible to make a zip file on the fly and send it to , triggers backend functions that zip the contents of /some-directory, send it … both back-end and front-end, and I've learned a ton throughout this process. While all of this is great, and it's "functional", it was definitely a hassle trying to get � The place where the frontend receives data from the backend exists in public/js/pullManager.js, so we can click on that file in the file browser on the left and click the line number (in this case

How To Optimize Your Site With GZIP Compression – BetterExplained, If we could send a .zip file to the browser (index.html.zip) instead of plain old index.html, But really, try to use Apache to compress your output if you can help it. a front-end optimization (of 75%!) can totally overshadow any back-end work . Adding your own bespoke WordPress frontend login page will help you give your users a better experience and make your membership site run smoothly. They will be redirected to the frontend login screen even when trying to access the default WordPress login. Here’s how your frontend login page could look.

How to zip and unzip files and folders on your remote server , When installing, lets say, a WordPress, you naturally need to move the files to the server. It's about ~100 times faster to move one big compressed file than a� The Electron app starts the backend server only in production build. During development, you will need to manually start the webpack-dev-server as mentioned earlier. Shutdown process. When shutting down the Electron app: Electron app handles the will-quit event by trying to stop the backend server and cancel the quit.

What I am trying to do on a desktop computer is to organise documents in folders by making folders to put them in. (that sounds more confusing, but hope you can follow) I can only do it on my laptop with no problem but not on desktop computer with same Word 2013.

Comments
  • You are not concatenating these strings properly for one. "attachment; filename=\"" + finalZipFilename + "\""
  • Could you have a look in the zip file with a text editor? Maybe it is a html file with an error from the server.
  • Looks like binary data with a lot of s
  • I ran a diff on the text editor view of the good and bad zips. They're almost identical except each line in the bad zip is missing a few random s