ExcelJSでファイル編集してみたお話と、出力ファイルが変な表示になったお話

ExcelJSでファイル編集してみたお話

テンプレートExcelファイルがあるとき、 JSからそのファイルを修正・修正したものをダウンロードしたいということで、ExcelJSというライブラリを触ってみました。

Excelファイルの読み込み、一部修正、そして別ファイルとしてダウンロードするまでの流れをやってみた。そんな記事。

ExcelJSでファイルを操作する

この記事ではExcelJSというライブラリを使ってExcelファイルの編集をしていきます。
適当にNuxt3プロジェクトを作って、ライブラリをインストール。

yarn add exeljs

インストールが済んだら、Excelファイルの操作を以下のように進めていきます。

1. Excelファイルの読み込み
2. 読み込んだファイルの修正
3. 修正したファイルのダウンロード

1. Excelファイルの読み込み

ExcelJSでは、FetchしてきたExcelファイルをarrayBuffer（バイト配列）の形にして読み込みます。

import * as ExcelJS from 'exceljs'

const path_exceltemplate="/template.xlsx"
const file=await fetch(path_exceltemplate)
const aBuffer=await file.arrayBuffer()
    
const workbook=new ExcelJS.Workbook()
await workbook.xlsx.load(aBuffer)

Excelファイルをフェッチ、バイト配列化し、実体化したExcelJSに読み込ませるだけ。かんたん。

2. 読み込んだファイルの修正

Excelの操作に入りますが、Excelはシートが複数あるので何番目のシートを使うか指定し、その後セルをターゲットにデータを入力していきます。

他のライブラリと比べ、ExcelJSでは"セル位置を指定して、それを修正する。"という動きが直感的にできていい感じ。

const sheet=workbook.worksheets[0]
const cell=sheet.getCell("C3")

cell.value="かきこんだ！"
cell.border={
    top: {style: "thin", color: {argb: "000000"}},
    right: {style: "thin", color: {argb: "000000"}},
    bottom: {style: "thin", color: {argb: "000000"}},
    left: {style: "thin", color: {argb: "000000"}},
}

セル位置を指定して、値と罫線を入れてみました。他にもスタイルとして、フォントや文字揃え、フィルにリッチテキストなんかもあるようだ。
Excel操作をそのままコードに落とし込む感覚、なんとなくSeleniumみを感じた（あっちはブラウザの操作をPythonに落とし込むのだけど、多分しっくりきた感覚の要因はここだと思う）

3. 修正したファイルのダウンロード

さて、修正できたのでダウンロードしよう。

ExcelJSでの読み込みはバイト配列だったので、出力も同じようにバイト配列を使えるみたいです。
バイト配列→Blob変換してから、BlobのオブジェクトURLを発行してダウンロードする感じ。

const buffer=await workbook.xlsx.writeBuffer()
const blob=new Blob([buffer], {type: "application/octet-binary"})

const url_download=window.URL.createObjectURL(blob)

const elm_a=document.createElement("a")
elm_a.href=url_download
elm_a.download="新しいファイル名.xlsx"
elm_a.click()
elm_a.remove()

これで修正されたExcelファイルがダウンロードできました。やったね。

変な表示になったお話

サンプルとして作ってみたファイルを書き出してみると、こんな感じになりました。

罫線がまっかっか。びっくり。

思い当たる節とえば、iPad版Numbersで書き出したExcelファイルをJSで編集して、iPad版Numbersで再表示させたことくらいだと思う。

Windowsマシンを引っ張り出して、Windowsマシンで作ったExcelファイルをテンプレートにしてWindos上で表示させると正常に表示されました。

OSによる違いというと、PythonライブラリにはLinux版とWindows版で中身が違うことがあるなぁとか思い出したところで、この記事はおしまい。