Search code examples
angularhttpclientvisual-web-developer

How to download large files (>1GB) with httpClient in angular?


I am working on angular 11 which uses httpClient method to download files from the server. This works fine for small size files. But for large files (approx 1GB), the download takes a lot of time although I get a link in the console.log (something like https://999.99.999.99:99999/DownloadFileServlet?filename=/tmp/ab/1607023356995.tar) after some seconds. If I click on this link, the download would start immediately, but otherwise, it would take a lot of time.

Here is my code:

            this.downloads.download(this.downloadInfo.filePathName)
             .subscribe(blob => {
                saveAs(blob, 'new_file_name'); 
                this.isContentLoading = false;
              }, 
             err => {
              this.isContentLoading = false;
              const message: LogMessage = {severity: Severity.ERROR, message: "Download not finished"};
              this.logMessageService.log(message);
              }
            );  

           download(fileName: string): Observable<Blob> {   
            return this.https.get(`https://${this.environment.path}/ab/DownloadFileServlet? 
            filename=${fileName}`,
            {
              responseType: "blob",
               withCredentials: true,
               reportProgress: true
            });
          }

Please share your experience with how can I efficiently download large files with this method.


Solution

  • So, instead of using the httpClient, if I directly provide the download link to window.location.href like: return window.location.href = https://${this.environment.path}/DownloadFileServlet?filename=${fileName}

    The download starts much faster. Though I am sure if this is the proper solution, would be happy to know a better idea if there is.