JavaScript
Node.js
Excel
NIJIBOXDay 3

xlsx-populateを使ってクライアントサイドでExcelを編集する

このエントリはNIJIBOX Advent Calendar 2017の3日目です。

:point_up: はじめに

IE、Edge、Excelから逃れられない人生を送っている皆様こんにちは:smiling_imp:

:whale: 今回の要件

  • Excelをダウンロードしたい
  • Excelテンプレートがすでにあるので、そこに値を埋め込めればいい
  • ある一定の時期のみ負荷がめっちゃかかる

最後の要件があったので、サーバ負荷をかけないように、
クライアントサイドでExcelを出力するのもありでは?と思い調べてみました。

:dark_sunglasses: ライブラリ選定

js-xlsx

一番starが多そう。
単純に読み込み、出力をしたもののテンプレートのスタイル情報が失われてしまった。
issueを読んでいると、このような用途であれば、別ライブラリがいいよと書いてあったので、それを試してみることに。

xlsx-template

試してみたものの値が置き換わらなかった...。

xlsx-populate

望んでいた結果が得られました。

どれもNode.jsでもブラウザでも動くよといった感じでした。

:bar_chart: xlsx-populateについて

リポジトリにも書いてありますが、このライブラリでは従来のライブラリのように、
XMLをdeserialize → モデル化 → 編集 → XMLにserialize
というフローではなく、直接XMLを操作するみたいです。

そのため、スタイル情報などが保持されたままであると。
今回はこの恩恵に大いにあずかった感じです:heart_eyes:

:warning: 今あるXMLの構造体を操作して修正していくので、
例えばワークシートのコピーなどは、このライブラリはサポートしていないです。
(シートのコピーを何個か作っておいて、不要なものを消したりといったことが必要)

詳しくはここを読んで下さい。

:eyes: 確認

:globe_with_meridians: ブラウザ互換性

IE11, Edge14, FF57(Mac), Chrome62(Mac)では問題なさそうでした。

:desktop: 性能

10000セルへの書き込みをして1秒かからないくらいでした。
intel core i5のmemory 16GBマシンでの検証なので、数値は参考程度で。

:cupid: デモ

デモ

  • テンプレートに値を入れ込む
  • 10000セルに書き込む
  • zip化する

の3パターンが試せるデモをあげました。
確認してみてください:blush: