PDF 合并听起来简单,但很多人遇到合并后页面顺序错乱、文件体积暴涨、或某些 PDF 无法合并的问题。今天聊聊纯前端 PDF 合并的核心问题和解决方案。
合并的常见场景
| 场景 | 说明 |
|---|---|
| 报告整合 | 把多个章节 PDF 合并成完整报告 |
| 票据汇总 | 合并月度发票、收据成一份 PDF |
| 申请归档 | 把申请表、成绩单等合并成一个文件 |
| 档案整理 | 相关文档统一归档保存 |
技术方案:pdf-lib 合并 PDF
核心实现
import { PDFDocument } from 'pdf-lib'
async function mergePdfs(files: File[]): Promise<Uint8Array> {
const mergedPdf = await PDFDocument.create()
for (const file of files) {
const arrayBuffer = await file.arrayBuffer()
const pdfDoc = await PDFDocument.load(arrayBuffer)
const pageIndices = Array.from({ length: pdfDoc.getPageCount() }, (_, i) => i)
const pages = await mergedPdf.copyPages(pdfDoc, pageIndices)
pages.forEach(page => mergedPdf.addPage(page))
}
return await mergedPdf.save()
}
关键点:页面复制
pdf-lib 通过 copyPages 复制页面:
const pages = await mergedPdf.copyPages(pdfDoc, pageIndices)
pages.forEach(page => mergedPdf.addPage(page))
关键点:顺序控制
PDF 按上传顺序合并,拖拽重排可调整顺序。
常见坑位
坑 1:合并后页面顺序错乱
用户上传的 PDF 顺序不对,合并结果也不对。
解决方案:
- 上传前检查文件顺序
- 提供拖拽排序功能
- 合并前预览效果
坑 2:合并后文件体积暴增
多个 PDF 合并后文件可能比预期大很多。
解决方案:
- 合并前先压缩各 PDF
- 使用压缩工具处理后下载
- 删除不必要页面再合并
坑 3:不同页面尺寸导致排版混乱
A4 和 Letter 混合合并后排版不一致。
解决方案:
- 统一页面尺寸后再合并
- 使用"适应页面"选项
- 分别合并同类文件
坑 4:加密 PDF 无法合并
受密码保护的 PDF 无法直接合并。
解决方案:
- 先解密 PDF
- 或使用支持解密的工具
- 注意:解密后文件安全性降低
坑 5:大文件合并导致浏览器卡顿
大量或超大 PDF 合并时浏览器可能卡死。
解决方案:
- 分批合并(每次 10 个以内)
- 关闭其他标签页释放内存
- 使用桌面软件处理大文件
和其他合并方式的区别
| 工具 | 处理方式 | 适用场景 |
|---|---|---|
| 纯前端工具 | 浏览器本地处理 | 敏感文档、隐私优先 |
| 在线转换工具 | 上传服务器处理 | 普通文档 |
| Adobe Acrobat | 桌面软件完整处理 | 复杂文档、专业需求 |
纯前端的优势是隐私安全,适合处理敏感文档。
使用建议
- 控制单次数量:建议 10 个 PDF 以内一次合并
- 检查文件顺序:合并前确认顺序正确
- 敏感文档本地处理:不要用上传式工具
- 检查输出效果:合并后抽查几页确认
总结
- PDF 合并核心是顺序控制和文件管理
- 大批量合并建议用桌面软件
- 纯前端方案适合私密文档
- 合并前务必备份原始文件
搜索「PDF合并」即可找到纯浏览器端工具,文件不上传服务器。