31
Help us understand the problem. What are the problem?

More than 3 years have passed since last update.

posted at

updated at

Organization

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:

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Sign upLogin
31
Help us understand the problem. What are the problem?