sheetjs_sheetjs/demos/meteor/README.md

95 lines
2.8 KiB
Markdown
Raw Normal View History

2017-05-24 22:52:35 +00:00
# Meteor
This library is universal: outside of environment-specific features (parsing DOM
tables in the browser, streaming write in nodejs), the core is ES3/ES5 and can
be used in any reasonably compliant JS implementation. It should play nice with
meteor out of the box.
2017-09-24 23:40:09 +00:00
Using the npm module, the library can be imported from client or server side:
```js
import XLSX from 'xlsx'
```
All of the functions and utilities are available in both realms. Since the core
data representations are simple JS objects, the workbook object can be passed on
the wire, enabling hybrid workflows where the server processes data and client
finishes the work.
2017-05-24 22:52:35 +00:00
## This demonstration
2017-09-24 23:40:09 +00:00
Note: the obvious extremes of pure-client code and pure-server code are covered
in other demos.
2017-05-24 22:52:35 +00:00
2017-09-24 23:40:09 +00:00
### Reading Data
The parse demo:
2017-05-24 22:52:35 +00:00
- accepts files from the client side
- sends binary string to server
- processes data on server side
- sends workbook object to client
- renders HTML and adds to a DOM element
2017-09-24 23:40:09 +00:00
The logic from within the `FileReader` is split as follows:
```js
// CLIENT SIDE
const bstr = e.target.result;
// SERVER SIDE
const wb = XLSX.read(bstr, { type: 'binary' });
// CLIENT SIDE
const ws = wb.Sheets[wb.SheetNames[0]];
const html = XLSX.utils.sheet_to_html(ws, { editable: true });
document.getElementById('out').innerHTML = html;
```
### Writing Data
2017-05-24 22:52:35 +00:00
The write demo:
2017-09-24 23:40:09 +00:00
- grabs HTML from the client side
- sends HTML string to server
- processes data on server side
2017-05-24 22:52:35 +00:00
- sends workbook object to client
2017-09-24 23:40:09 +00:00
- generates file on client side and triggers a download
2017-05-24 22:52:35 +00:00
2017-09-24 23:40:09 +00:00
The logic from within the `click` event is split as follows:
2017-09-24 23:40:09 +00:00
```js
// CLIENT SIDE
const html = document.getElementById('out').innerHTML;
// SERVER SIDE
const wb = XLSX.read(html, { type: 'binary' });
// CLIENT SIDE
const o = XLSX.write(wb, { bookType: 'xlsx', type: 'binary' });
saveAs(new Blob([s2ab(o)], {type:'application/octet-stream'}), 'sheetjs.xlsx');
```
2017-09-24 23:40:09 +00:00
This demo uses the FileSaver library for writing files, installed through the
[`pfafman:filesaver` wrapper](https://atmospherejs.com/pfafman/filesaver).
## Setup
This tree does not include the `.meteor` structure. Rebuild the project with:
```bash
meteor create .
npm install babel-runtime meteor-node-stubs xlsx
meteor add pfafman:filesaver
meteor
```
2017-05-24 22:52:35 +00:00
2017-09-24 23:40:09 +00:00
## Environment-Specific Features
2017-05-24 22:52:35 +00:00
2017-09-24 23:40:09 +00:00
File-related operations like `XLSX.readFile` and `XLSX.writeFile` will not be
2017-05-24 22:52:35 +00:00
available in client-side code. If you need to read a local file from the client,
use a file input or drag-and-drop.
2017-09-24 23:40:09 +00:00
Browser-specific operations like `XLSX.utils.table_to_book` are limited to
2017-05-24 22:52:35 +00:00
client side code. You should never have to read from DOM elements on the server
side, but you can use a third-party virtual DOM to provide the required API.
2017-09-24 23:40:09 +00:00
[![Analytics](https://ga-beacon.appspot.com/UA-36810333-1/SheetJS/js-xlsx?pixel)](https://github.com/SheetJS/js-xlsx)