3.3 PDFファイル結合ツール

(1/1)
PDF結合
書類を整理していると、契約書や見積書など複数のPDFファイルを1つにまとめたい場面に出会う。しかし無償のAdobe Acrobat Readerには結合機能が用意されておらず、有償のAcrobat Proへの契約やオンラインサービスへのアップロードが必要になる。社外秘の文書をオンラインサービスにアップロードすることに抵抗を感じる人も多い。
本項では、ファイルを外部に送信せず、ブラウザだけで動くPDFファイル結合ツール「mergePDF.html」を作る。まず作成の動機を説明し、続いてPDFがバイナリ形式のためJavaScript単体では扱えない理由と、pdf-libというライブラリで解決する仕組みを解説する。最後にCodexへ渡すプログラム仕様書を示す。

目次

作成の動機

契約書・見積書・報告書など、複数のPDFファイルを1つにまとめて管理したい場面は多い。ところが、多くのパソコンに標準で入っているAdobe Acrobat Readerには、PDFファイルを結合する機能が用意されていない。結合を行うには、有償のAdobe Acrobat Proを契約したりサードパーティ製品を購入するか、オンラインのPDF結合サービスにファイルをアップロードする必要がある(Adobe PDF結合の完全ガイド)。

しかし、純正品のAdobe Acrobat Proは高価である。一方、契約書や見積書のような社外秘の文書をオンラインサービスにアップロードすることに抵抗を感じる人は少なくないだろう。
そこで、ファイルを一切外部に送信せず、ブラウザの中だけで複数のPDFファイルを結合できるツールを自作することにした。下表に、PDF結合の主な選択肢を比較する。
PDFファイルを結合する方法の比較
方法費用ファイルの外部送信
Adobe Acrobat Reader無料—(結合機能なし)
Adobe Acrobat Pro月額1,518円~(2026年7月時点)不要
サードパーティ製PDF編集ソフト買い切り9,000円台~(PDFelement、Foxit PDF Editorなど)不要(インストール型)
オンラインのPDF結合サービス無料~有料必要(サーバーへアップロード)
自作の結合ツール(本項)無料不要(ブラウザ内で完結)
自作のツールであれば、追加のソフトを購入する必要も、ファイルを外部に送信する必要もない。
次節では、なぜJavaScriptだけでは簡単にPDFファイルを扱えないのか、その理由を説明する。

JavaScript単体ではPDFファイルを扱うことができない

PDFファイルの内部構造
大きな写真大きな写真
(1672×941 ピクセル, 94 Kbyte)
テキストファイルであれば、JavaScriptの標準機能だけで内容を読み書きできる。ところがPDF(Portable Document Format)は、文字だけでなく、フォント、画像、ページの配置情報などを1つのファイルにまとめたバイナリ形式の複雑な構造を持つファイルである。ページの区切り、文字の座標、圧縮されたデータなどが独自の書式で記録されているため、ブラウザに標準で備わっている機能だけでは、PDFファイルの内部構造を正しく読み取ったり組み立てたりすることができない。
テキストファイルとPDFファイルの違い
比較項目テキストファイルPDFファイル
形式文字がそのまま並んでいる文字・フォント・画像・レイアウトを独自形式でまとめたバイナリ
読み書きJavaScript標準機能だけで可能専用ライブラリが必要
ページの概念なしあり(ページごとに内部オブジェクトを持つ)
そこで使うのが、PDFファイルの内部構造を解析し、ページの取り出しや結合を行う専用のライブラリである。本ツールではpdf-libというJavaScriptライブラリを使う。pdf-libは、Node.jsやブラウザなど、どのJavaScript実行環境でも動作するように作られたオープンソースのライブラリで、MIT Licenseで公開されている。ネイティブコード(OSに依存する部品)を使わず、純粋なJavaScriptだけで実装されているため、ブラウザの中だけでPDFファイルを読み込み、ページを取り出し、新しいPDFファイルとして書き出す処理を完結できる(PDF-LIB公式サイト)。

pdf-libの本体は、cdnjsjsDelivrといったCDN(コンテンツ配信ネットワーク)からJavaScriptのコードとして読み込む。これはプログラムの部品を取得する処理であり、ユーザーが結合するPDFファイルの内容が外部に送信されるわけではない。結合処理そのものはライブラリを読み込んだあとブラウザの中だけで行われ、PDFファイルのデータがインターネットを経由することはない。

PDFファイル結合ツールのプログラム仕様書

以上を踏まえて、PDFファイル結合ツール「mergePDF.html」のプログラム仕様書を示す。これがCodexに渡すプロンプトそのものになる。
プログラム仕様書(プロンプト)
# 目標
複数のPDFファイルを結合して1つのPDFファイルにする。

# プログラム・ファイル名 mergePDF.html
# プロジェクト・フォルダ作成 - プログラム・ファイル名の拡張子を除いた主ファイル名と同じ名前のサブフォルダを作成し、以降の作業はサブフォルダで行う。 - すでにサブフォルダがあれば、そのサブフォルダに移動して以降の作業を進める。
# 入力 - ユーザーは結合したいPDFファイル(単数または複数)を選択入力する。 - ユーザーは結合後のPDFファイル名を入力する。デフォルトはmergePDFs.pdf。 - ユーザーが「結合」ボタンをクリックすると、ファイルの結合と出力を行う。
## 処理 - ユーザーが指定したPDFファイルを結合する。
## 通信 なし。
## 出力 - プログラム上部にタイトル「PDF結合」、バージョン番号、製作者「(c)pahoo.org Powered by Codex」と記載する。 - 結合後のPDFファイルは、ブラウザのダウンロード機能によって取得する。
## 例外・エラー処理 - 無限ループに陥ったり、システム・エラーが出たときは、画面にエラー情報を表示して終了すること。
## 記録 なし。
# テスト観点・合格条件 - Codexは、ダミーのPDFファイルを5本作成し、上記仕様の通りに結合できるかを10回実行する。 - 前提条件、制約条件が守られていること。
# 前提条件 - 仕様で分からないことがあれば、ユーザーに質問すること。 - JavaScriptを使った1本のプログラム・ファイルにすること。 - クライアントPCのブラウザ(OSやブラウザの種類は問わない)で動作すること。 - スマホでも利用できること。 - httpサーバなどやNode.jsなどサーバ技術は使わず、ブラウザの機能で完結すること。 - コーディングは「Airbnb JavaScript Style Guide」にのっとること。 - プログラムファイルにコメントとして次の情報を記載すること。 - プログラムの名称 - バージョン - 目的 - 動作環境 - 著作権表示および使用条件 - インストール方法 - お問い合わせ
# 制約条件 - インターネットとのデータ送受信は行わないこと。 - 外部ライブラリを使用する場合は、下記のサイトに限定すること https://cdn.jsdelivr.net/ https://cdnjs.cloudflare.com/ https://ajax.googleapis.com/ https://code.jquery.com/ https://ajax.aspnetcdn.com/ - プログラムがMIT Licenseに違反していないこと。
「# 入力」に結合したいPDFファイルの選択と結合後のファイル名を、「## 出力」にダウンロード処理を、「# 前提条件」「# 制約条件」に動作環境と安全性を書き込んである。この仕様書をCodexに渡すと、pdf-libを使ってPDFファイルを読み込み、ページを結合し、ダウンロード用のファイルとして書き出すツールが生成される。
完成したPDFファイル結合ツール
完成したPDFファイル結合ツール

参考サイト

(この項おわり)
header