0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

CSVの差分結果をHTMLで保存して共有する(価格変更の確認記録に)

0
Last updated at Posted at 2026-10-10

CSVで価格を直したあと、商品番号やサイズまで変わっていないか確認したいことがあります。確認した結果を残せれば、あとで見返したり、別の人に見てもらったりできます。

そこで、CSVの変更を見るに、比較結果をHTMLファイルとして保存する機能を追加しました。HTMLは、ブラウザで開けるファイルです。

変えるつもりだった項目と、ほかの変更を見る

以下は、説明用の架空の商品一覧です。価格だけを変更する予定だった、という例にします。実際の画面を撮ったものではありません。

変更前:

ID,商品番号,商品名,価格,サイズ
A101,00101,コーヒー,500,小
A102,00102,釣り針,300,1/0
A103,00123,収納箱,800,中

変更後:

ID,商品番号,商品名,価格,サイズ
A103,123,収納箱,800,中
A101,00101,コーヒー,550,小
A102,00102,釣り針,300,Jan-00

行の順番も変わっています。変わっていない ID を目印にすると、比較する値は次のようになります。

ID 項目 変更前 変更後
A101 価格 500 550
A102 サイズ 1/0 Jan-00
A103 商品番号 00123 123

予定した価格の変更に加えて、サイズと商品番号も変わっています。ツールは違いを示し、予定した変更かどうかは人が確認します。変更の原因を自動で判断する機能ではありません。

ExcelでCSVを開く際には、先頭のゼロが消えるなど、文字が数値として扱われる場合があります。番号を文字列として取り込む方法は、Microsoftの公式説明にあります。比較して確認することに加え、編集時の設定も見直せます。

結果を保存する手順

  1. CSVの変更を見るを開く。
  2. 「変更前のCSV」と「変更後のCSV」を選ぶ。
  3. 両方のCSVで同じ行を見分けられる列を選ぶ。上の例では ID を使う。
  4. 「変更を表示」を押して結果を読む。
  5. 「比較結果をHTMLで保存」を押す。

保存するHTMLには、次の内容を入れています。

  • 変更前後のファイル名と、行を見分けるために選んだ列。
  • 比較した日時。
  • 追加・削除・変更・変更なしの件数。
  • 値が変わったセルの、変更前後の値。
  • 追加された行と削除された行。

変更なしの行は件数だけです。画面の一覧は100件ずつ表示しますが、保存するHTMLは表示中のページに関係なく、比較結果の全件を対象にします。

保存したファイルはブラウザで開いて読むための資料です。CSVを再編集したり、登録先のシステムへ取り込んだりするためのファイルではありません。

入力した文字を、文字として表示する

このツールはセルを数値や日付へ変換せず、文字列で比べます。00123 と 123 は別の値です。

保存する表は比較結果のデータから作ります。セルにHTMLのタグに見える文字が入っていても、文字として表示するようにしています。保存ファイルにスクリプトや外部の画像は入れません。

CSVの中身はブラウザ内で処理し、外部に送信しません。保存ボタンを押したときだけ、比較結果を端末へダウンロードします。Webページを開くための通信とは別です。

結果には入力ファイル名と比較した値が含まれます。人に渡す前に、内容を確認してください。

対応する範囲

入力はUTF-8のCSVで、ファイルはそれぞれ2 MiBまでです。UTF-8は、ファイルの文字を保存する形式の一つです。両方のCSVには同じ列名が必要で、行を照合する列は1つだけ選びます。選ぶ列には空欄や重複がないことが必要です。

上の例で商品番号を目印にすると、00123 と 123 は別の行になり、削除と追加として出ます。番号が変わった理由まで推測して、同じ行として扱うことはしません。

保存するHTMLの上限は8 MiBです。超えた場合は保存を止めます。一部だけを保存したファイルは出しません。元のCSVがなければ、失われた値を復元することもできません。

GitHubのソースコードと対応範囲では、CSVの読み取り、比較、HTML保存の実装を確認できます。Xの @supportapp3_labでは、小さなツールの開発と、公開後の反応を発信しています。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?