PDF編集Webアプリ

書類等をスキャンした際に、見開きページの分割、不要ページの削除、ページの回転、順序の整理などを視覚的に行い、見やすいPDFに仕上げるためのWebアプリケーションです。

🚀 クイックスタート（初めての方）

🌐 オンライン版を使う（インストール不要・一番簡単）

ソフトのインストールなしで、ブラウザからすぐに使えます。

オンライン版を開く
 https://ishiyama-apps.duckdns.org/pdf/

※ サーバーのメモリに制限があるため、200ページを超えるような大容量PDFを扱う場合は、下記の「ローカル版」の利用をおすすめします。

💻 ローカル版を使う（自分のPCにインストール）

このフォルダ内の start_server.bat をダブルクリック
黒い画面（コマンドプロンプト）が開いてサーバーが起動します
ブラウザで http://127.0.0.1:5000 を開いてください
使い終わったら、黒い画面で Ctrl+C を押してサーバーを終了します

注意: 初回起動時にエラーが出る場合は、下記の「セットアップ」を先に行ってください。

使用目的

スキャナーで書類をスキャンする際によくある問題を解決します：

📖 見開きページの分割: 本や資料を見開きでスキャンした場合、左右を別々のページに分割
🗑 不要ページの削除: 空白ページや不要な表紙などを簡単に削除
🔄 ページの回転: 向きが間違っているページを正しい向きに修正（左90°/右90°/180°）
📑 ページの並べ替え: スキャン順が前後してしまったページを正しい順序に整理
🖍 マスキング（黒塗り）: 個人情報や機密情報を黒塗りで隠す
📍 シンボルマーク追加: スキャン補正用のシンボルマークを四隅に追加
🔢 ページ番号付加: 好きな位置・書式でページ番号を全ページに追加
✂ ファイル分割: PDFを複数のファイルに分割して個別に保存
📄 個別ファイル保存: 各ページを個別のPDFファイルとしてZIP保存
🖼 画像PDF変換: フォント問題を回避するため画像ベースのPDFに変換
🖼 各ページを画像として保存: PDFの各ページをPNG/JPEG画像ファイルに変換し、まとめてZIPまたは1枚ずつ個別にダウンロード
⚫ 白黒PDF変換: カラーPDFを白黒に変換してファイルサイズを削減（最大500MB対応）
🖊 スキャン濃度補正: スキャンした文書の薄い手書き文字を濃くして読みやすく
💾 1クリックで保存: 編集結果をワンクリックでPDFとしてダウンロード

すべての操作がブラウザ上で完結し、サムネイルを見ながら直感的に編集できます。

主な機能

PDFの追加とクリア

ドラッグ＆ドロップ対応: ファイル選択ボタンの右側にある専用エリアにファイルをドラッグ＆ドロップして簡単アップロード
複数ファイルを一括選択: ファイル選択ダイアログでCtrl+A等で大量のPDFを一気に選択してアップロード（ファイル数制限なし）
選択したファイル名が表示され、複数選択時はファイル数をホバーで全一覧確認可能
選択した順にページが追加されます
全ページをクリアして最初からやり直し

見開き分割

横長ページ（見開きでスキャンしたページ）を自動検出して左右に分割
選択したページのみ分割、または全ての横長ページを一括分割

ページ削除

サムネイルをクリックして削除対象を選択（赤い枠と「×」マークで表示）
複数ページを同時に選択して一括削除
削除後、即座にサムネイルが更新

ページ編集

サムネイルをクリックして選択（黄色い枠で表示）
左90°回転 / 右90°回転 / 180°回転ボタンでページの向きを修正
偶数・奇数ページ入れ替え、全ページ逆順などの一括操作

ページ並べ替え

方法1: クリックした順にページを並べ替え（丸数字①②③...で表示されます）
方法2: 1ページを選択して「前へ」「次へ」ボタンで位置を微調整
偶数・奇数ページ入れ替え、全ページ逆順などの操作も可能

マスキング（黒塗り）

PDFの特定領域を黒塗りで隠すことができます
ページを選択すると大きなキャンバスに表示され、マウスドラッグで範囲指定
範囲調整機能: 選択後に表示される8つのハンドル（4隅+4辺の中点）をドラッグして範囲を微調整可能
端まで選択: プレビュー画像の外側までドラッグしても端まで選択できます
ページ間隔とオフセットを指定して、複数ページに同じ位置のマスキングを一括適用
個人情報や機密情報を隠すのに便利

シンボルマーク追加

スキャン時の補正用シンボルマークを用紙の四隅に追加
各コーナー（左上・右上・左下・右下）ごとに個別設定が可能
シンボルの種類を選択: ■（黒四角）、□（白四角）、◆（黒ダイヤ）、◇（白ダイヤ）、●（黒丸）、○（白丸）、★（黒星）、☆（白星）、▲（黒三角）、△（白三角）
位置調整: 各コーナーからの横位置・縦位置をスライダーで5〜100ポイントの範囲で調整
シンボルサイズ: 8〜36ポイントで調整可能
省スペース設計: 各コーナーの設定を横並びのタブで素早く切り替え可能。設定パネル全体を折りたたむこともできます。

ページ番号付加

全ページにページ番号を一括追加できます。
豊富なカスタマイズ:
- 配置: 左上/中央上/右上/左下/中央下/右下の6箇所から選択
- 書式: 1, - 1 -, Page 1, 1 / 10 など主要なパターンに対応
- 左右反転: 偶数・奇数ページで位置を左右反転（見開き本のような配置）が可能
- 開始指定: 番号自体の開始値や、どのページから番号を振り始めるかを指定可能
- 詳細調整: フォントサイズ、文字色（黒/グレー/白）、余白を自由に調整
プレビュー機能: 実際に適用する前に、サムネイル上で結果を確認できます。
シンボルマーク追加と同様、省スペースなタブUIと折りたたみ機能を搭載しています。

ファイル分割

サムネイル間の縦線をクリックして分割位置を指定
複数の分割線を設定してPDFを複数のファイルに分割
各パートのファイル名を個別に指定可能
「保存不要」チェックボックスで不要なパートをスキップ
日本語ファイル名に完全対応（個別ダウンロード方式）
使用例: 10ページのPDFで3ページ目と7ページ目に分割線を入れると「1～3ページ」「4～7ページ」「8～10ページ」の3つに分割。不要なパートにチェックを入れると保存されません

個別ファイル保存

PDFの各ページを個別のPDFファイルとして保存
例：「資料.pdf」（5ページ）→「資料_1.pdf」「資料_2.pdf」...をZIPでまとめてダウンロード
画像PDF変換オプション: フォント問題を回避するため、各ページを画像PDFとして保存可能
画質（DPI）を選択可能: 96/150/200/300 DPI

PDFを保存

現在の編集状態をプレビュー
「名前をつけてダウンロード」ボタンで保存
最初にアップロードしたファイル名が自動入力される
ファイル名を自由に変更してダウンロード可能
画像PDF変換機能: フォントが正しく表示されない問題を解決
PDFを画像ベースのPDFに変換して保存（画質選択可能）
白黒（グレースケール）PDF保存: カラーPDFを白黒に変換してファイルサイズを削減
白黒PDFとして保存（テキストベース）または白黒画像PDFとして保存（画質選択可能）
大容量PDFのファイルサイズ削減に効果的（最大500MBまで対応）
スキャン濃度補正: スキャンした文書の薄い手書き文字を濃くして読みやすくする機能
補正の強さをスライダーで1〜9段階調整（弱：わずかに濃く　強：かなり濃く）
グレースケール変換オプションで文字をさらにくっきり
DPI選択可能: 150/200/300 DPI
各ページを画像ファイルとして保存: PDFの各ページをPNGまたはJPEG画像ファイルに変換して保存
- 「まとめてZIPでダウンロード」: 全ページを1つのZIPファイルにまとめてダウンロード
- 「個別に画像をダウンロード」: 1枚ずつ順番にダウンロード（ファイル分割保存と同様の方式）
- ファイル名の連番はゼロ埋め対応: ページ数が10以上なら01〜、100以上なら001〜（ファイラーで正しく並ぶ）
- 形式はPNG（高品質・可逆圧縮）またはJPEG（小サイズ・非可逆圧縮）から選択
- 画質（DPI）を選択可能: 96/150/200/300 DPI

共通機能

すべてのタブで編集内容が共有され、シームレスに作業可能
サムネイルサイズをスライダーで調整可能
タブ切り替えはキャッシュされ、高速に動作
Undo/Redo機能: 元に戻す（Ctrl+Z）・やり直す（Ctrl+Y）ボタンで操作を取り消し/やり直し
最大20個の履歴を保存し、いつでも前の状態に戻せます
スティッキーヘッダー: 編集タブでスクロールしても操作ボタンが画面上部に固定
レスポンシブ・省スペースUI: ノートPCなどの小さい画面でも使いやすいよう、設定メニューのタブ化や折りたたみ機能を搭載。メニュー自体も高さ制限によりスクロール可能です。
ブラウザ更新時は自動的にクリーンな状態に戻ります

セットアップ（初回のみ）

start_server.bat を実行してエラーが出る場合は、以下の3ステップでセットアップしてください：

📝 3ステップでセットアップ

Pythonをインストール（入っていない場合のみ）
Python公式サイトからダウンロードしてインストール
重要: インストール時に「Add Python to PATH」にチェックを入れてください
このフォルダでコマンドプロンプトを開く
エクスプローラーでこのフォルダを開き、アドレスバーに cmd と入力してEnter
必要なライブラリをインストール
以下のコマンドをコピーして貼り付けてEnter:
```
pip install Flask PyMuPDF pypdf
```
うまくいかない場合は以下も試してください:
```
py -m pip install Flask PyMuPDF pypdf
```

💡 それでもうまくいかない場合

下記のリンクから Gemini に質問してみてください。「Python」「Flask」「PyMuPDF」「pypdf」のインストール方法を教えてくれます：

Gemini で質問する

Gemini への質問例:
「WindowsでPythonとFlask、PyMuPDF、pypdfをインストールする手順を教えて」

Mac をお使いの場合

ターミナルを開く（Finder → アプリケーション → ユーティリティ → ターミナル）
このアプリのフォルダに移動（例: cd ~/Downloads/PDF_ページ編集）
以下を実行:
```
pip3 install Flask PyMuPDF pypdf
```

起動方法

🌐 Web版はインストール不要で https://ishiyama-apps.duckdns.org/pdf/ からすぐに使えます。以下は、自分のPCにインストールして使う「ローカル版」の起動手順です。

簡単な方法（Windows）

start_server.bat をダブルクリック → ブラウザで http://127.0.0.1:5000 を開く

コマンドで起動する方法

Windows:

python app.py
# または
py app.py

Mac:

python3 app.py

サーバーが起動したら、ブラウザで http://127.0.0.1:5000 にアクセスしてください。

使い方

📱 基本的な流れ

取り込み → 「PDFの追加とクリア」タブでPDFをアップロード（ドラッグ&ドロップまたはファイル選択）
編集 → 各タブで必要な編集作業を行う（順序は自由）
- 📖 見開き分割：横長ページを左右に分割
- 🗑️ ページ削除：不要なページを削除
- 🔄 ページ編集：回転、ページ入れ替え、逆順など
- 📑 ページ並べ替え：クリック順または前後移動で並べ替え
- 🖍️ マスキング：黒塗りで情報を隠す
- 📍 シンボルマーク追加：スキャン補正用マークを四隅に追加
- 🔢 ページ番号付加：自由な書式でページ番号を追加
保存 → 編集結果を保存
- ✂️ ファイル分割保存：PDFを複数ファイルに分割してダウンロード
- 📄 個別ページ保存：各ページを個別のPDFファイルとしてZIP保存
- 💾 全体を保存：編集したPDFをまるごとダウンロード

💡 よくある使い方

パターン1：見開きスキャンした本を整理

「PDFの追加」でスキャンしたPDFをアップロード
「見開き分割」で横長ページを左右に分割
「ページ削除」で空白ページを削除
「ページ編集」で向きが逆のページを回転
「全体を保存」で完成したPDFをダウンロード

パターン2：複数の書類をまとめて分類

「PDFの追加」で複数のPDFをまとめてアップロード
「ページ並べ替え」で順序を整理
「ファイル分割保存」でページ範囲ごとに別ファイルとして保存

パターン3：個人情報を隠して共有

「PDFの追加」で書類をアップロード
「マスキング」で個人情報部分を黒塗り
「全体を保存」で黒塗りPDFをダウンロード

パターン4：フォント問題を解決

「PDFの追加」でPDFをアップロード
「全体を保存」または「個別ページ保存」で「画像PDFとして保存」にチェック
画質（DPI）を選択してダウンロード

※ PDFを画像化することで、どの環境でも同じように表示されるようになります

パターン5：大容量PDFのサイズを削減

「PDFの追加」で大容量のPDFをアップロード（最大500MB対応）
「全体を保存」で「白黒PDFとしてダウンロード」または「白黒画像PDFとしてダウンロード」を選択
白黒化によってファイルサイズが大幅に削減されます

※ カラー情報が不要な書類や資料に最適です

⌨️ 便利なショートカット

Ctrl+Z: 元に戻す（最大20回）
Ctrl+Y: やり直す
Ctrl+F5 (Windows) / Cmd+Shift+R (Mac): ブラウザの完全リロード

サーバーの終了方法

サーバーを起動したターミナル/コマンドプロンプトで Ctrl+C を押すとサーバーが停止します。

技術仕様

バックエンド: Flask (Python)
PDF処理: PyMuPDF (サムネイル生成・ページ分割), pypdf (ページ操作)
フロントエンド: Vanilla JavaScript, CSS

ライセンス

MIT License

注意事項

このアプリは開発用サーバーで動作します。個人のPC上でローカルに使用することを想定しています。
アップロード可能なファイルサイズは最大500MBです。
ブラウザを更新すると、サーバー側のデータは自動的にクリアされます。
編集中のPDFは一時的にサーバー上の uploads/ フォルダに保存されます。
タブを切り替えてもサムネイルはキャッシュされ、再読み込みは発生しません（高速動作）。
PDF編集操作（削除、回転、分割など）を行うと、すべてのタブのサムネイルが自動更新されます。

⚠️ サーバーメモリ制限について

使用可能なメモリが限られているため、200ページ以上のPDFの読み込みやサムネイル生成時にエラーが出る可能性があります。

大容量PDFを処理する必要がある場合は、以下の方法でご対応ください：

複数のPDFに分割してアップロード
ローカル環境（自分のPC）でこのアプリを実行（python app.py）
オンラインサーバーで利用（https://ishiyama-apps.duckdns.org/pdf/）

トラブルシューティング

変更が反映されない場合

ブラウザのキャッシュをクリアして再読み込み: - Windows: Ctrl+F5 - Mac: Cmd+Shift+R

ページが削除/編集できない場合

ブラウザを完全に更新してPDFを再アップロード
ブラウザの開発者ツール（F12）のコンソールでエラーを確認

更新履歴

2026-09-03

バグ修正: オンライン版（さくらVPS）でPDFがアップロードできない不具合を解決
- アップロードやドラッグ&ドロップが失敗する原因を調査し、サーバー側で古くなっていたファイル（script.js / index.html / style.css）を最新版に更新
- ドラッグ&ドロップの位置がずれるとブラウザがPDFをそのまま開いてしまう問題も合わせて修正
バグ修正: オンライン版でページ削除・分割・回転・並べ替えなどが404エラーで失敗する不具合を修正
- 共通処理が/pdfプレフィックスを付けずにAPIを呼び出していたため、オンライン版でのみ発生していた
UI改善: オンライン版のポータルから「使い方」を経由してアプリを開くように変更
- ポータルの「PDFページ編集」リンクが、この使い方ページ（/pdf/usage）を経由してから編集画面へ進むように変更
設定変更: シンボルマークのデフォルトサイズを14pt→8ptに変更

2026-06-12 (v2.10)

バグ修正: 「全体を保存」タブの表示不具合を修正
- 「保存」グループ → 「全体を保存」縦タブをクリックしても何も表示されない問題を解決
- コンテンツIDの不一致を修正

2026-05-20 (v2.9)

各ページを画像ファイルとして保存機能を追加（「全体を保存」タブ）
- PDFの各ページをPNGまたはJPEG画像ファイルに変換してダウンロード可能に
- 「まとめてZIPでダウンロード」: 全ページを1つのZIPにまとめてダウンロード
- 「個別に画像をダウンロード」: 1枚ずつ順番にダウンロード
- 連番ゼロ埋め対応: ページ数に応じて桁数を自動調整（10以上→01〜、100以上→001〜）

2026-05-09 (v2.7)

ページ番号付加機能の追加: 全ページに自由な書式・位置でページ番号を追加可能に
- 偶数・奇数ページの左右反転、開始ページ指定、プレビュー表示などに対応
UIの大幅な最適化（省スペース化）: 小さい画面のノートPC等でも使いやすいようにUIを改善
- シンボルマーク設定やページ番号設定を「横並びタブ」形式に変更し、垂直方向のサイズを圧縮
- 設定メニュー全体を1クリックで開閉（折りたたみ）できる機能を追加
- スティッキーメニュー自体の高さに制限を設け、メニュー内スクロールを可能に

2026-03-07

バグ修正: 複数タブ問題によりダウンロードできない不具合を修正
バグ修正: 「名前をつけてダウンロード」が500エラーになる問題を修正
UX改善: ダウンロードエラー時の案内を改善

2026-03-01 (v2.6)

スキャン濃度補正機能を追加: スキャンした文書の薄い手書き文字を濃くして読みやすくする機能を「全体を保存」タブに追加

2025-12-01

ドラッグ＆ドロップ機能の追加: ファイルをドラッグ＆ドロップで簡単に追加可能に

2025-10-15

初期リリース: PDF見開きページ分割機能