架構
本頁以一張圖概覽 pdf2image 的組成：載入時的相依注入、對外類別 pdf2image、內部的進度遮罩，以及它們依賴的 CDN 函式庫。
系統概覽
graph TB
subgraph 載入時
Boot[啟動 IIFE] --> Inject[注入 preconnect / preload / script / stylesheet]
end
subgraph CDN
PDFJS[pdf.js 3.4.120<br/>+ worker + CMap]
JSZip[JSZip 3.7.1]
CSS[pdf2image.css @latest]
end
Inject --> PDFJS
Inject --> JSZip
Inject --> CSS
App[呼叫端] --> Class[pdf2image]
Class -->|convert| PDFJS
PDFJS --> Canvas[canvas.toDataURL]
Canvas --> Images[images 陣列]
Class -->|download| JSZip
Images --> JSZip
JSZip --> Anchor[a download 點擊]
Class --> Loading[pdf2imageLoading 遮罩]
CSS --> Loading
分層
| 層 | 組成 | 職責 |
|---|---|---|
| 載入 | 啟動 IIFE | 把 pdf.js、JSZip、樣式表掛進 <head> |
| 對外 API | pdf2image 類別 |
正規化參數、convert()、download()、images |
| 內部 UI | pdf2imageLoading |
建立與更新進度遮罩，依語系切換文字 |
| 外部相依 | pdf.js、JSZip、瀏覽器 API | 解析渲染 PDF、打包 ZIP、觸發下載 |
跨切原則
- 不打包相依：所有第三方程式碼都在執行時從 CDN 取得，套件本體只有一個小檔案
- 純前端：PDF 不離開瀏覽器，沒有任何伺服器端元件
- 單一入口：對外只有
pdf2image一個類別，pdf2imageLoading不對外暴露