PDF
■PDFとは
僕「PDFとは何か知りたい」 - Qiita
https://qiita.com/zawawahoge/items/4312649f8d56f8983ffb
プログラマーから見たPDFファイル - アンテナハウス PDF資料室
https://www.antenna.co.jp/pdf/reference/pdftext.html
PDFってこうなってる? 実践でPDFの内部構造を学ぼう Part 1：PDFを理解するための第一歩 - 株式会社インターワーク
https://www.intwk.co.jp/2024/03/26/%E5%AE%9F%E8%B7%B5%E3%81%A7pdf%E3%81%AE%E5%86%85%E9%83%A8%E6%A7%8...
PDF に謎の漢字が含まれるとき
https://gist.github.com/xl1/940d653451fd96a06618a6df08d5df84
■PDFの作成（ソフトウェア）
Adobe Acrobat 9 Pro をダウンロード
https://helpx.adobe.com/jp/acrobat/kb/acrobat-8-9-product-downloads.html
CS5のライセンスで認証。
未検証だが、以下のソフトもある。
無料 PDF 結合・分割ソフト CubePDF Page - CubeSoft
https://www.cube-soft.jp/cubepdfpage/
無料のPDF編集ソフト「CubePDF Utility」、v3.0.0に - 窓の杜
https://forest.watch.impress.co.jp/docs/news/1581841.html
■PDFの作成（PDFの結合方法）
ツールバーの「結合 → ファイルを単一のPDFに結合」をクリックする。
ドラッグ＆ドロップでPDFを追加する。
必要に応じて順番を入れ替える。
「ファイルを結合」をクリックする。
■PDFの作成（しおり付きPDFの作成方法）
結合済みファイルを開く。
しおりを設定する。
デフォルトでしおりを表示させる
http://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q12105211992
■PDFの表示
PDF.js - Home
https://mozilla.github.io/pdf.js/
PDF.jsを使用してWebブラウザでPDFファイルを表示する | MESCIUS.devlog - メシウス株式会社
https://devlog.mescius.jp/javascript-pdf-viewer-pdfjs/
「PDF.js」に任意コード実行の脆弱性 〜多くのWebサイト・アプリに影響 - 窓の杜
https://forest.watch.impress.co.jp/docs/news/1593338.html
PDF.jsのページめくりアニメーション - 電脳情報局
https://www.omakase.net/blog/2021/09/pdfjs-page.html
pdf.jsを使って日本語ファイルを表示する #JavaScript - Qiita
https://qiita.com/ReiTsukikazu/items/2d6627b3987535526814
WebページにPDFを1ページだけ表示する場合、以下のようなコードで対応できる。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PDF.js</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.7.107/pdf.min.js"></script>
<style>
#pdf-container {
width: 100%;
height: 600px;
border: 1px solid #000;
overflow: auto;
}
canvas {
display: block;
margin: 0 auto;
}
</style>
</head>
<body>
<h1>PDF.js</h1>
<div id="pdf-container">
<canvas id="pdf-canvas"></canvas>
</div>
<script>
const url = 'sample.pdf'; // 表示したいPDFファイルのURLを指定
const pdfjsLib = window['pdfjs-dist/build/pdf'];
// PDFの設定
pdfjsLib.GlobalWorkerOptions.workerSrc = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.7.107/pdf.worker.min.js';
// PDFを読み込んで表示
const loadingTask = pdfjsLib.getDocument(url);
loadingTask.promise.then(function(pdf) {
console.log('PDF loaded');
// 1ページ目を表示
pdf.getPage(1).then(function(page) {
console.log('Page loaded');
const scale = 1.5;
const viewport = page.getViewport({ scale: scale });
const canvas = document.getElementById('pdf-canvas');
const context = canvas.getContext('2d');
canvas.height = viewport.height;
canvas.width = viewport.width;
const renderContext = {
canvasContext: context,
viewport: viewport
};
const renderTask = page.render(renderContext);
renderTask.promise.then(function () {
console.log('Page rendered');
});
});
}, function (reason) {
console.error('Error loading PDF:', reason);
});
</script>
</body>
</html>
ページの前後移動もできるようにする場合、以下のようなコードで対応できる。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PDF.js</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.7.107/pdf.min.js"></script>
<style>
#pdf-container {
width: 100%;
height: 600px;
border: 1px solid #000;
overflow: auto;
}
canvas {
display: block;
margin: 0 auto;
}
#navigation {
margin-bottom: 10px;
}
</style>
</head>
<body>
<h1>PDF.js</h1>
<div id="navigation">
<button id="prev-page">前のページ</button>
<button id="next-page">次のページ</button>
<span>ページ: <span id="page-num"></span> / <span id="page-count"></span></span>
</div>
<div id="pdf-container">
<canvas id="pdf-canvas"></canvas>
</div>
<script>
const url = 'sample.pdf'; // 表示したいPDFファイルのURLを指定
const pdfjsLib = window['pdfjs-dist/build/pdf'];
// PDFの設定
let pdfDoc = null,
pageNum = 1,
pageRendering = false,
pageNumPending = null,
scale = 1.5,
canvas = document.getElementById('pdf-canvas'),
context = canvas.getContext('2d');
pdfjsLib.GlobalWorkerOptions.workerSrc = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.7.107/pdf.worker.min.js';
// PDFを読み込み
const loadingTask = pdfjsLib.getDocument(url);
loadingTask.promise.then(function(pdf) {
pdfDoc = pdf;
document.getElementById('page-count').textContent = pdf.numPages;
// 初期表示で1ページ目を描画
renderPage(pageNum);
});
// ページをレンダリングする関数
function renderPage(num) {
pageRendering = true;
// ページを取得して描画
pdfDoc.getPage(num).then(function(page) {
const viewport = page.getViewport({ scale: scale });
canvas.height = viewport.height;
canvas.width = viewport.width;
const renderContext = {
canvasContext: context,
viewport: viewport
};
const renderTask = page.render(renderContext);
// 描画完了後にページレンダリングを解除
renderTask.promise.then(function () {
pageRendering = false;
if (pageNumPending !== null) {
renderPage(pageNumPending);
pageNumPending = null;
}
});
});
// 現在のページ番号を表示
document.getElementById('page-num').textContent = num;
}
// 前後のページをキューに追加する関数
function queueRenderPage(num) {
if (pageRendering) {
pageNumPending = num;
} else {
renderPage(num);
}
}
// 前のページを表示
document.getElementById('prev-page').addEventListener('click', function() {
if (pageNum <= 1) {
return;
}
pageNum--;
queueRenderPage(pageNum);
});
// 次のページを表示
document.getElementById('next-page').addEventListener('click', function() {
if (pageNum >= pdfDoc.numPages) {
return;
}
pageNum++;
queueRenderPage(pageNum);
});
</script>
</body>
</html>
■PDFとPostScript
PostScript - Wikipedia
https://ja.wikipedia.org/wiki/PostScript
PostScriptはAdobeが開発した文章記述言語。
ベクトルベースで高繊細な描画が可能。
以下のとおりプログラミング言語としての特性を持ち、チューリング完全となっている。
・条件分岐。（if, ifelse）
・ループ。（for, repeat, loop）
・再帰的な関数定義が可能。
・スタック操作を通じたデータ操作。
Portable Document Format - Wikipedia
https://ja.wikipedia.org/wiki/Portable_Document_Format
PDFはPostScriptをもとにAdobeが開発した文章フォーマット。
PostScriptの持つグラフィック能力やフォント処理能力を引き継いだうえで、表示面や操作面で改良が行なわれている。
またPDFは上に記載したプログラミング言語としての特性は削除されているので、安全性が向上している。
Ghostscript - Wikipedia
https://ja.wikipedia.org/wiki/Ghostscript
PostScriptを書くための環境 | Studio Fruit Jam Blog
https://blog.studiofruitjam.com/2017/01/02/programing-env/
PostScript言語を触ってみる
https://zenn.dev/kaityo256/articles/ghostscript_sample
PDFを無料で圧縮できるオフライン方法！GhostscriptとPDFelementを解説
https://pdf.wondershare.jp/pdf-tips/pdf-compress-ghostscript.html
ImageMagickとPHPを用いてPDFを画像変換する (GhostScript) | iret.media
https://iret.media/10187
Ghostscriptをインストールすれば、コマンドでPostScriptやPDFを扱うことができる。