Generating a .xls file from JSON data and saving it for download

Question

Generating a .xls file from JSON data and saving it for download

I'm trying to encode a JSON object to XLSX and download it using the following code:

this.data = {
   foo: "xyz"
}
let json2xls = require('json2xls');
var data = json2xls(this.data);

let blob = new Blob([data], { type: "binary" });
let a = angular.element("a");
a.attr("href", this.$window.URL.createObjectURL(blob));
a.attr("download", "myfile.xlsx");
a[0].click();

Although the file is being created and downloaded, Excel cannot open it. I have verified that a different method works by sending this.data to the server, saving it with fs.writeFile(), and then downloading the file.

var data = json2xls(this.data);

Is there a way to successfully convert from JSON to XLS in a browser environment?

javascript angularjs json meteor blob

Answer 1

Answer №1

To achieve this, you can implement it on the server side:

Start by installing exceljs package.

npm install -s exceljs

After installation, proceed to generate the file using the following steps:

import Excel from 'exceljs';

WebApp.connectHandlers.use('/download-link', function(req, res, next) {
  // Define parameters for the xls generation process using request url...
  const params = req.url.split('/');
  // ... e.g. /download-link/user-id
  // Here, params[0] will be 'download-link'
  const user = Meteor.users.findOne(params[1]);

  const workbook = new Excel.stream.xlsx.WorkbookWriter({});
  workbook.created = new Date();
  workbook.modified = new Date();
  const sheet = workbook.addWorksheet('Your sheet name');

  res.writeHead(200, {
    'Content-Disposition': `attachment;filename=${filename}`,
    'Content-Type': 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
  });
  workbook.stream.pipe(res);

  const headers: [
        { header: 'Column 1', key: 'col1', width: 20 },
        { header: 'Column 2', key: 'col2', width: 15 },
  ];
  sheet.columns = headers;

  // Use sheet.addRow(rowData) to add each row in your sheet.

  workbook.commit();
});

Answer 2

To achieve this, you can implement it on the server side:

Start by installing exceljs package.

npm install -s exceljs

After installation, proceed to generate the file using the following steps:

import Excel from 'exceljs';

WebApp.connectHandlers.use('/download-link', function(req, res, next) {
  // Define parameters for the xls generation process using request url...
  const params = req.url.split('/');
  // ... e.g. /download-link/user-id
  // Here, params[0] will be 'download-link'
  const user = Meteor.users.findOne(params[1]);

  const workbook = new Excel.stream.xlsx.WorkbookWriter({});
  workbook.created = new Date();
  workbook.modified = new Date();
  const sheet = workbook.addWorksheet('Your sheet name');

  res.writeHead(200, {
    'Content-Disposition': `attachment;filename=${filename}`,
    'Content-Type': 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
  });
  workbook.stream.pipe(res);

  const headers: [
        { header: 'Column 1', key: 'col1', width: 20 },
        { header: 'Column 2', key: 'col2', width: 15 },
  ];
  sheet.columns = headers;

  // Use sheet.addRow(rowData) to add each row in your sheet.

  workbook.commit();
});

Generating a .xls file from JSON data and saving it for download

Answer №1

Similar questions

Processing file to retrieve information (JavaScript)

Rules for validating string and numeric combinations in Vuetify are essential for ensuring accurate

Interactive Checkbox Generated in Jquery UI Accordion Header

How can you efficiently load images as you scroll without encountering duplicates?

Tips on implementing two ng-repeat directives within a specific element

Merge jQuery with the jetpack infinite scroll feature

Opening a new tab on any webpage with C# Selenium

Use the map function to pass onClick to every individual image

Tips for showcasing live data in Material-UI's table component

Which type of element does Youtube utilize for the videos on its own domain - <iframe> or <video>?

The performance of json.JSONDecoder().decode() may not be optimal

It seems that there is an issue with accessing the root directory while utilizing the yo

Creating JavaScript object fields with default values in an AngularJS model: A Step-by-Step Guide

Access control and permissions in Angular's UI router

I am facing an issue where childnodes return as undefined after a clone operation, making it impossible for me to assign their attributes as needed,

Ensure that the JavaScript file is fully loaded and that the JavaScript function has been properly initiated prior to executing any additional

Unable to render images in Angular client due to issues with accessing upload path in Express Node.js backend

What causes meteor to freeze when utilizing WebApp and sending npm package to serve personalized files?

How can you alter a property within an array of records retrieved from a Mongoose query?

Reproducing a table row