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
);
}
);
}