In the project(that was writen on Angular4.3) we use xlsx to create xlsx/csv tables for download by user. The problem that we faced is when we try to export a big amount of data, original json file can be 100+Mb and converted xlsx/csv file can be 28Mb, and all this conversion operation is processing on client side, it use all resources on main thread. I try to add web wroker to move all process to another thread and when a try to download created file from wroker I get an error:
export.worker.bundle.js:2 Uncaught Error: cannot save file test.xlsx
Example code to adding worker by click:
btn.addEventListener('click', (e) => {
const worker = new Worker('./export.worker.bundle.js');
const payload = {
data: [
{ name: 'Moran', role: 'back' },
{ name: 'Alain', role: 'front' },
{ name: 'Tony', role: 'back' },
{ name: 'Mike', role: 'back' },
{ name: 'Abo', role: 'back' },
{ name: 'Toni', role: 'back' }
]
};
worker.postMessage(payload);
worker.onmessage = (e) => {
console.log(e.data);
// worker.terminate();
};
});
Worker code:
(function() {
const XLSX = require('xlsx');
const utils = require('xlsx').utils;
const self = this;
self.onmessage = function(e) {
console.log('Worker data: ', e.data);
const fileName = 'test.xlsx';
const ws = XLSX.utils.json_to_sheet(e.data.data);
const wb = XLSX.utils.book_new();
XLSX.utils.book_append_sheet(wb, ws, 'test');
XLSX.writeFile(wb, fileName);
self.postMessage('Process complete!');
};
})();
XLSX.writeFile(wb, filename, write_opts) attempts to write wb to filename. In browser-based environments, it will attempt to force a client-side download.
This line XLSX.writeFile attempt to start download and it failed on it and also this operation is taking all resources from thread as I understood.
Is posible to start file download from worker? or I need to go back to main thread for it ?
