Node 和浏览器里实现 Excel 的解析和生成
Excel 是常用的办公软件，我们会用它来做数据的整理。
后台管理系统一般都会支持从 Excel 导入数据，或者导出数据到 Excel 文件：
那这种功能是如何实现的呢？
在 Node 和浏览器里，如何解析、生成 Excel 文件呢？
一般我们会用 exceljs 这个包来做。
在 npm 官网可以看到，这个包每周有 30w+ 的下载量，用的还是很多的：
我们具体写代码试试：
安装 exceljs：
把刚才这个 excel 文件复制过来：
我们在代码里读取出来看看：
工作表就是这个东西：
每个工作表下都是独立的表格。
也就是 workbook（工作簿） > worksheet（工作表） > row（行） > cell（列）这样的层级关系。
每一层都可以遍历：
所以我们遍历 sheet、row、cell 这几层，就能拿到所有的数据。
跑下看看：
确实都拿到了。
这样就是数据导入，我们从 excel 文件里解析出数据，然后存入数据库。
exceljs 还提供了简便的方法，可以直接调用 worksheet 的 getSheetValues 来拿到表格数据，不用自己遍历：
解析 excel 文件还是很简单的。
导入数据的时候，按照格式从中解析数据然后存入数据库就行。
有同学可能会说，那如果 excel 的格式不符合要求呢？
一般我们都会提供一个 excel 模版，用这个模版来填数据，然后再导入。
excel 解析我们会了，再来看下 excel 的生成：
相当简单，也是按照层次结构，先 addWorkSheet、然后 addRows，之后写入文件。
可以看到 worksheet 的名字，还有每行的数据都是对的。
右边手机号那一列最宽，因为我们设置了 width 是 50。
excel 是可以设置格式的，比如字体、背景色等，在代码里同样可以。
就是遍历 row、cell，根据行数设置 style 就好了：
style 可以设置 font、fill、border、alignment 这些。
跑下看看：
这样，就完成了数据的导出。
而且，exceljs 这个库可以直接在浏览器里用。
我们试试：
创建 index.html，从 CDN 引入 exceljs 包。
添加一个 file 类型的 input，onchange 的时候解析其中的内容，解析逻辑和之前一样，只是从 readFile 换成 load。
起个静态服务：
浏览器访问下：
可以看到，同样解析出了 excel 的内容。
然后再试试生成 excel：
前面的逻辑一样，只是把 writeFile 换成了 writeBuffer。
这里我创建了一个 10M 的 ArrayBuffer 来写入数据，之后再读取。
跑下试试：
可以看到，确实有数据了。
那有了 arraybuffer 的数据，如何触发下载呢？
创建一个 a 标签，设置 download 属性，然后触发点击就可以了。
也就是这样：
跑一下：
可以看到，生成了 excel 并且触发了下载。
打开文件，可以看到和 node 里生成的一样。
案例代码上传了 github：https://github.com/QuarkGluonPlasma/nestjs-course-code/tree/main/exceljs-test
总结
Excel 的导入导出是后台管理系统的常见功能，我们一般用 exceljs 来实现。
excel 文件分为 workbook、worksheet、row、cell 这 4 层，解析和生成都是按照这个层次结构来。
解析就是 readFile 之后，遍历 worksheet、row，拿到 cell 中的数据 。
生成就是 addWorkSheet、addRow 添加数据，然后 writeFile 来写入文件。
如果是在浏览器里，就把 readFile 换成 load，把 writeFile 换成 writeBuffer 就好了。
浏览器里生成 excel 之后，可以通过 a 标签触发下载，设置 download 属性之后，触发点击就好了。
这样，我们就分别在 node 和浏览器里完成了 excel 的解析和生成。
#前端# #后端#
