sheetjs-clone/docbits/20_import.md
SheetJS af3df44633 version bump 0.11.5: "string" type
- proper JS string input / output type
- bower main now uses full version (fixes #820 h/t @newmesiss)
- DOM parse directly acts on innerHTML (see #779 h/t @danxfisher)
- unicode core props and ext props (fixes #822 h/t @fureweb-com)
- shim update for IE10/11
- test refresh and flow checks
2017-09-30 02:18:11 -04:00

4.0 KiB

Parsing Workbooks

For parsing, the first step is to read the file. This involves acquiring the data and feeding it into the library. Here are a few common scenarios:

nodejs read a file (click to show)

readFile is only available in server environments. Browsers have no API for reading arbitrary files given a path, so another strategy must be used.

if(typeof require !== 'undefined') XLSX = require('xlsx');
var workbook = XLSX.readFile('test.xlsx');
/* DO SOMETHING WITH workbook HERE */
Browser read TABLE element from page (click to show)

The table_to_book and table_to_sheet utility functions take a DOM TABLE element and iterate through the child nodes.

var worksheet = XLSX.utils.table_to_book(document.getElementById('tableau'));
/* DO SOMETHING WITH workbook HERE */

Alternatively, the HTML code can be extracted and parsed:

var htmlstr = document.getElementById('tableau').outerHTML;
var worksheet = XLSX.read(htmlstr, {type:'string'});
Browser download file (ajax) (click to show)

Note: for a more complete example that works in older browsers, check the demo at http://oss.sheetjs.com/js-xlsx/ajax.html). The <demos/xhr/> directory also includes more examples with XMLHttpRequest and fetch.

var url = "http://oss.sheetjs.com/test_files/formula_stress_test.xlsx";

/* set up async GET request */
var req = new XMLHttpRequest();
req.open("GET", url, true);
req.responseType = "arraybuffer";

req.onload = function(e) {
  var data = new Uint8Array(req.response);
  var workbook = XLSX.read(data, {type:"array"});

  /* DO SOMETHING WITH workbook HERE */
}

req.send();
Browser drag-and-drop (click to show)

Drag-and-drop uses the HTML5 FileReader API, loading the data with readAsBinaryString or readAsArrayBuffer. Since not all browsers support the full FileReader API, dynamic feature tests are highly recommended.

var rABS = true; // true: readAsBinaryString ; false: readAsArrayBuffer
function handleDrop(e) {
  e.stopPropagation(); e.preventDefault();
  var files = e.dataTransfer.files, f = files[0];
  var reader = new FileReader();
  reader.onload = function(e) {
    var data = e.target.result;
    if(!rABS) data = new Uint8Array(data);
    var workbook = XLSX.read(data, {type: rABS ? 'binary' : 'array'});

    /* DO SOMETHING WITH workbook HERE */
  };
  if(rABS) reader.readAsBinaryString(f); else reader.readAsArrayBuffer(f);
}
drop_dom_element.addEventListener('drop', handleDrop, false);
Browser file upload form element (click to show)

Data from file input elements can be processed using the same FileReader API as in the drag-and-drop example:

var rABS = true; // true: readAsBinaryString ; false: readAsArrayBuffer
function handleFile(e) {
  var files = e.target.files, f = files[0];
  var reader = new FileReader();
  reader.onload = function(e) {
    var data = e.target.result;
    if(!rABS) data = new Uint8Array(data);
    var workbook = XLSX.read(data, {type: rABS ? 'binary' : 'array'});

    /* DO SOMETHING WITH workbook HERE */
  };
  if(rABS) reader.readAsBinaryString(f); else reader.readAsArrayBuffer(f);
}
input_dom_element.addEventListener('change', handleFile, false);

Parsing Examples

Note that older versions of IE do not support HTML5 File API, so the Base64 mode is used for testing.

Get Base64 encoding on OSX / Windows (click to show)

On OSX you can get the Base64 encoding with:

$ <target_file base64 | pbcopy

On Windows XP and up you can get the Base64 encoding using certutil:

> certutil -encode target_file target_file.b64

(note: You have to open the file and remove the header and footer lines)