title: Angular Download Large blobs
body: <p>I have an issue similar to <a href="https://stackoverflow.com/questions/46932213/how-to-download-large-file-with-javascript">this one</a> where I am successfully downloading a blob generated from a backend via HTTP GET <strong>but</strong> the file is being saved to browser memory before the download begins. </p>
  
  <p>There's no problem when downloading small files but it doesn't immediately download 100mb+ files. </p>
  
  <p>Subscribing to the GET itself is causing the delay of saving the large files.</p>
  
  <p>I'm using Angular 6 with an object store backend. Here's the download function:</p>
  
  <pre><code>finalDownload(url: string) {
    let headers = new HttpHeaders();
  
    headers = headers.append('X-Auth-Token', token);
  
    return this.http.get(url, { headers, responseType: 'blob' })
    .subscribe(response =&gt; {
      saveAs(response);
    })
  }
  </code></pre>
  
  <p>Here's the process:</p>
  
  <ol>
  <li>User hits the download button</li>
  <li>GET request with headers is fired to back end</li>
  <li>As soon as I subscribe for the response, the blob is stored in browser memory. </li>
  <li>When the blob is completely stored in browser, the saveAs/download begins</li>
  </ol>
  
  <p>Step 3 is where the issue is. 
  This devtools screenshot <a href="https://i.stack.imgur.com/G2NFv.png" rel="nofollow noreferrer">with 108 MB transferred</a> accumulates to the file size (I downloaded a 100 mb file) before the download itself to filesystem begins.</p>