Angular Download Large blobs

2019-05-18 16:14发布

问题:

I have an issue similar to this one where I am successfully downloading a blob generated from a backend via HTTP GET but the file is being saved to browser memory before the download begins.

There's no problem when downloading small files but it doesn't immediately download 100mb+ files.

Subscribing to the GET itself is causing the delay of saving the large files.

I'm using Angular 6 with an object store backend. Here's the download function:

finalDownload(url: string) {
  let headers = new HttpHeaders();

  headers = headers.append('X-Auth-Token', token);

  return this.http.get(url, { headers, responseType: 'blob' })
  .subscribe(response => {
    saveAs(response);
  })
}

Here's the process:

  1. User hits the download button
  2. GET request with headers is fired to back end
  3. As soon as I subscribe for the response, the blob is stored in browser memory.
  4. When the blob is completely stored in browser, the saveAs/download begins

Step 3 is where the issue is. This devtools screenshot with 108 MB transferred accumulates to the file size (I downloaded a 100 mb file) before the download itself to filesystem begins.