0

I am trying to download very large files using xlsx and file-saver in angular. I even tried streamsaver instead of file-saver and still get the same error. I get the results from my api just fine on testing through postman. it doesn't show on chrome dev tools as it says it is too large.

I am able to download upto some rows but after that it starts giving me the error - net::ERR_INCOMPLETE_CHUNKED_ENCODING 200.

I read multiple posts and figured that nginx might be causing the issue. I see the response is sent on http 1.1 on devtools and transfer-encoding:chunked is always enabled.

nginx file is like this though:

worker_processes  1;

events {
  worker_connections  1024;
}

http {
 gzip  on;
 gzip_http_version 1.0;
gzip_comp_level 2;
gzip_min_length 1100;
gzip_buffers     4 8k;
gzip_proxied any;
gzip_types
    # text/html is always compressed by HttpGzipModule
    text/css
    text/javascript
    application/x-javascript
    text/xml
    text/plain
    text/x-component
    application/javascript
    application/json
    application/xml
    application/rss+xml
    font/truetype
    font/opentype
    application/vnd.ms-fontobject
    image/svg+xml;
gzip_static on;
 {"
gzip_proxied  expired no-cache no-store private auth;
gzip_disable  "MSIE [1-6]\.";
gzip_vary on;

server {
  listen 8080;
   server_name  localhost;

root   /usr/share/nginx/html;
index  index.html index.htm;
include /etc/nginx/mime.types;

location / {
  try_files $uri $uri/ /index.html;
}

} }

The backend is fine and returning rows.

My code :

 private saveExcelFile(buffer: any, fileName: string): void {
 
     const CSV_TYPE ='text/csv;charset=utf-8';
     const CSV_EXTENSION = '.csv';
 
     const data: Blob = new Blob([buffer], {type: CSV_TYPE});
     FileSaver.saveAs(data, fileName + CSV_EXTENSION);
   }

  exportToExcelWithoutLimit = ()=>{
    const headerColumns = [
      ['Status', 'Date', 'Type'
      ]
    ];
    this.resultsService
           .fetchData(
             this.criteria
           )
           .subscribe(
             (results: Results) => {
               if (!results) {
                this.alertService.info(
                  "No data"
                );
               } else {
                 var jsonArray = JSON.parse(JSON.stringify(results.details.data));
                 const ws: XLSX.WorkSheet = XLSX.utils.json_to_sheet([]);
                 XLSX.utils.sheet_add_json(ws, jsonArray, { origin: 'A2', skipHeader: true });
                 XLSX.utils.sheet_add_aoa(ws, headerColumns, { origin: 'A1' });
                 const csvOutput: string = XLSX.utils.sheet_to_csv(ws);
                 this.saveExcelFile(csvOutput, 'filename');
               }
             },
             err => {
              this.loading = false;
              this.alertService.error(
                "Error downloading excel",
                this.alertId,
                false,
                true
              );
             }
           );   
    }

user2868864
  • 165
  • 2
  • 12
  • XLSX only supports a max of 1048576 rows this is why it is safe to assume that this could be part of the issue. – Steve020 Jun 15 '22 at 18:38
  • @Steve020 : the error occurs at 120000 rows not a million. So, I think there is some other error due to memory but I am not sure what can i do to resolve it. – user2868864 Jun 15 '22 at 18:40
  • Ahh my mistake lol accidently thought you put a million. Previously when I needed to export to a file like excel in any of my previous angular projects I used https://www.npmjs.com/package/ngx-export-as – Steve020 Jun 15 '22 at 18:45

0 Answers0