网站网页优化怎么做企业网站建设感想
ℹ️ 需求描述
上一版本发布后，有用户提出想要将图片转换（或者说生成更为贴切）PDF文档，于是有了今天要分享的内容。
功能概述：将用户选择的文件，预处理（如裁剪、旋转）后，绘制到新的 PDF 文件内。
📄 关于PDF
PDF（Portable Document Format，便携式文档格式）是当今最广泛使用的电子文档格式之一，几乎成为数字文档交换的代名词。它的发展历程涉及技术创新、商业竞争和标准化演进。
📜发展简史
- 1991年，Adobe 联合创始人 John Warnock 提出 “Camelot” 计划，目标是创建一种 跨平台、固定布局的电子文档格式，确保在任何设备上都能正确显示。
- 1993年，Adobe 正式发布 PDF 1.0，配套推出 Acrobat 1.0（用于创建和阅读 PDF 的工具）。
- 2008年，Adobe 将 PDF 提交给 ISO（国际标准化组织），使其成为开放标准（ISO 32000-1）。
🚀技术演进
| 版本 | 发布时间 | 重要改进 |
|---|---|---|
| PDF 1.0 | 1993 | 基础文本、图像支持 |
| PDF 1.5 | 2003 | 支持 JPEG2000、图层、增强压缩 |
| PDF/A (2005) | 长期存档标准 | 适合法律、档案存储 |
| PDF/X (2001) | 印刷出版标准 | 确保颜色、字体精确输出 |
| PDF 2.0 (2017) | 最新 ISO 标准 | 强化安全、标签化结构 |
🌍PDF 的现状（2020s+）
1. 无处不在的应用
- Web 浏览器：Chrome、Firefox 内置 PDF 阅读器。
- 移动端：iOS/Android 原生支持 PDF 预览。
- 云服务：Google Drive、Dropbox 直接解析 PDF。
- 开发者工具：如
pdf-lib、PDF.js、Apache PDFBox。
2. 现代 PDF 生态
- 可编辑 PDF（Adobe Acrobat、Foxit）。
- PDF 表单（交互式字段，支持电子签名）。
- OCR 技术（将扫描件转为可搜索文本）。
- 3D PDF（嵌入三维模型，用于工程图纸）。
3. 竞争对手
- Office Open XML（DOCX, PPTX）：微软的开放文档格式。
- EPUB：更适合电子书。
- Web 技术：HTML + CSS 逐渐替代简单 PDF（如在线报告）。
🧑💻 技术实现
pdf-lib 库
pdf-lib 是一个强大的 JavaScript/TypeScript 库，用于 创建、修改和操作 PDF 文档。它完全在 Node.js 和浏览器环境中运行，不依赖任何外部服务或原生依赖（如 PDFtk 或 Ghostscript）。
主要功能
- ✅ 创建新的 PDF 文档
- ✅ 修改现有的 PDF（如添加文本、图片、水印）
- ✅ 合并多个 PDF 文件
- ✅ 提取 PDF 页面
- ✅ 添加表单字段（如文本框、复选框）
- ✅ 支持嵌入字体（包括自定义字体）
- ✅ 支持加密和权限控制
基本用法
创建一个简单的 PDF 文档
import { PDFDocument, rgb } from 'pdf-lib';async function createPdf() {// 创建一个新的 PDF 文档const pdfDoc = await PDFDocument.create();const page = pdfDoc.addPage([550, 750]); // [width, height]// 添加文本page.drawText('Hello, PDF-Lib!', {x: 50,y: 700,size: 30,color: rgb(0, 0, 0), // 黑色});// 保存 PDFconst pdfBytes = await pdfDoc.save();return pdfBytes; // 可写入文件或发送给客户端
}createPdf().then(pdfBytes => {// Node.js 写入文件const fs = require('fs');fs.writeFileSync('output.pdf', pdfBytes);
});
优缺点
✅ 优点
- 纯 JavaScript，跨平台（Node.js 和浏览器均可运行）
- API 直观，文档完善
- 支持现代 PDF 功能（如嵌入字体、表单）
- 不需要外部依赖（如 PDFtk、Ghostscript）
❌ 缺点
- 处理超大 PDF 时可能较慢
- 不支持 PDF 渲染（仅修改结构，不能像 PDF.js 那样显示 PDF）
- 某些高级 PDF 功能（如 OCR）不支持
核心代码
安装依赖：
pnpm i pdf-lib
const sharp = require('sharp')
const { statSync, writeFileSync } = require('node:fs')
const { PDFDocument } = require('pdf-lib')/*** 图片转换为PDF* @param {sharp.Sharp} img* @param {String} target*/
const toPdf = async (img, target)=>{const pdf = await PDFDocument.create()const page = pdf.addPage()const pdfImg = await pdf.embedJpg(await img.toBuffer())const { width, height } = pdfImg.scale(1)page.setSize(width, height)page.drawImage(pdfImg, { x:0, y:0, width, height })const pdfBytes = await pdf.save()writeFileSync(target, pdfBytes)
}
效果预览
未来展望
能够合并所选图片到一个 PDF 文档。