一个功能完整的微信小程序,可以将多张照片快速合并为一个PDF文件。支持图片压缩、实时预览、批量处理等功能。
- 多图片选择: 支持从相册选择最多20张图片
- 智能压缩: 自动压缩大于2MB的图片,保持清晰度
- 实时预览: 选择后即时预览,支持删除和重新排序
- PDF生成: 服务端高质量PDF生成,支持多种页面格式
- 在线预览: 生成后可直接在小程序内预览PDF
- 文件下载: 支持保存到手机本地存储
- 历史记录: 查看和管理之前生成的PDF文件
- 分享功能: 支持分享给微信好友
- 响应式设计: 适配各种屏幕尺寸
- 错误处理: 完善的网络异常和错误重试机制
- 性能优化: 图片压缩、分片上传、智能缓存
- 用户体验: 流畅的动画效果和实时进度反馈
- 简洁的操作界面
- 支持多图片选择和预览
- 实时显示图片数量和大小
- 一键清空和删除功能
- 圆形进度指示器
- 分步骤状态展示
- 详细的处理信息反馈
- 支持取消操作
- PDF文件信息展示
- 在线预览功能
- 一键下载到本地
- 分享给微信好友
- 查看所有生成的PDF
- 快速重新下载
- 文件管理功能
- 存储空间统计
选择图片 → 预览编辑 → 开始上传 → 生成PDF → 预览下载 → 保存分享
↓ ↓ ↓ ↓ ↓ ↓
多选支持 删除重排 进度显示 状态轮询 在线预览 历史记录
┌─────────────────┐ HTTPS/WSS ┌─────────────────┐
│ 微信小程序 │ ◄──────────────► │ Nginx反向代理 │
│ │ │ │
│ ┌─────────────┐ │ │ ┌─────────────┐ │
│ │ 首页 │ │ │ │ SSL终端 │ │
│ │ 图片选择 │ │ │ │ 负载均衡 │ │
│ └─────────────┘ │ │ └─────────────┘ │
│ ┌─────────────┐ │ └─────────────────┘
│ │ 处理页 │ │ │
│ │ 上传进度 │ │ │
│ └─────────────┘ │ ┌─────────────────┐
│ ┌─────────────┐ │ │ Node.js集群 │
│ │ 结果页 │ │ │ │
│ │ 预览下载 │ │ │ ┌─────────────┐ │
│ └─────────────┘ │ │ │ Express API │ │
│ ┌─────────────┐ │ │ │ 服务器 │ │
│ │ 历史页 │ │ │ └─────────────┘ │
│ │ 记录管理 │ │ │ ┌─────────────┐ │
│ └─────────────┘ │ │ │ PDF生成服务 │ │
└─────────────────┘ │ │ (pdf-lib) │ │
│ └─────────────┘ │
│ ┌─────────────┐ │
│ │ 文件管理服务 │ │
│ │ 清理&存储 │ │
│ └─────────────┘ │
└─────────────────┘
│
┌─────────────────┐
│ SQLite数据库 │
│ │
│ ┌─────────────┐ │
│ │ 用户数据 │ │
│ │ PDF历史 │ │
│ │ 统计信息 │ │
│ └─────────────┘ │
└─────────────────┘
miniprogram/
├── pages/ # 页面文件
│ ├── index/ # 首页 - 图片选择
│ │ ├── index.js # 页面逻辑
│ │ ├── index.wxml # 页面结构
│ │ ├── index.wxss # 页面样式
│ │ └── index.json # 页面配置
│ ├── processing/ # 处理页 - 上传和生成进度
│ ├── result/ # 结果页 - 预览和下载
│ └── history/ # 历史记录页
├── components/ # 自定义组件
│ └── upload-progress/ # 上传进度组件
├── utils/ # 工具函数
│ ├── api.js # API接口封装
│ └── util.js # 通用工具函数
├── config/ # 配置文件
│ └── config.js # 应用配置
├── images/ # 图片资源
├── app.js # 应用入口
├── app.json # 全局配置
├── app.wxss # 全局样式
└── project.config.json # 项目配置
server/
├── routes/ # 路由模块
│ ├── auth.js # 用户认证 (微信登录)
│ ├── file.js # 文件上传处理
│ ├── pdf.js # PDF生成和管理
│ ├── share.js # 分享功能
│ ├── stats.js # 统计功能
│ └── cleanup.js # 清理服务
├── services/ # 业务服务
│ ├── cleanup-service.js # 文件清理服务
│ ├── user-service.js # 用户管理服务
│ └── wechat-service.js # 微信API服务
├── database/ # 数据库模块
│ └── pdf-history-db-simple.js # SQLite数据库操作
├── config/ # 配置文件
│ ├── ssl.js # SSL证书配置
│ └── wechat.js # 微信小程序配置
├── scripts/ # 部署和维护脚本
│ └── deploy.sh # 自动部署脚本
├── data/ # 数据存储
│ └── pdf_history.db # SQLite数据库文件
├── uploads/ # 上传文件临时存储
├── pdfs/ # 生成的PDF文件存储
├── logs/ # 日志文件
├── .env.production # 生产环境配置
├── ecosystem.config.js # PM2配置
├── package.json # 依赖配置
└── app.js # 服务器入口
- 框架: 微信小程序原生框架
- 样式: WXSS + Flexbox布局
- 状态管理: 页面级状态 + 全局数据管理
- 组件化: 自定义组件开发
- 运行环境: Node.js 16+
- Web框架: Express.js
- 数据库: SQLite (better-sqlite3)
- PDF生成: pdf-lib
- 文件处理: multer
- 进程管理: PM2
- 反向代理: Nginx
- SSL证书: Let's Encrypt (可选)
- 进程管理: PM2 Cluster模式
- 自动部署: Shell脚本
# 1. 克隆项目
git clone <repository-url>
cd img2pdfnew
# 2. 启动后端服务
cd server
npm install
npm run dev
# 3. 配置小程序
# 使用微信开发者工具打开 miniprogram 目录
# 修改 config/config.js 中的服务器地址为 http://localhost:3000
# 4. 开始使用
# 在微信开发者工具中预览小程序- Node.js 16.0+
- npm 8.0+
- 微信开发者工具
- 服务器 (Ubuntu 20.04+ 推荐)
- 域名和SSL证书 (生产环境)
git clone <repository-url>
cd img2pdfnewcd server
npm install
npm run dev# 使用自动部署脚本
cd server/scripts
chmod +x deploy.sh
sudo ./deploy.sh
# 或手动部署
cd server
npm install --production
cp .env.production .env
pm2 start ecosystem.config.js --env production编辑 miniprogram/config/config.js:
const config = {
env: 'production', // 或 'development'
server: {
production: {
baseUrl: 'https://your-domain.com',
apiUrl: 'https://your-domain.com/api'
}
}
}- 在微信公众平台注册小程序账号
- 获取AppID
- 编辑
miniprogram/project.config.json:
{
"appid": "your-app-id"
}- 使用微信开发者工具打开
miniprogram目录 - 预览和调试功能
- 上传代码到微信后台
- 提交审核并发布
主要配置文件: server/.env.production
# 基本配置
NODE_ENV=production
PORT=1919
BASE_URL=https://your-domain.com
# 微信小程序配置
WECHAT_APP_ID=your-app-id
WECHAT_APP_SECRET=your-app-secret
# 文件存储配置
UPLOAD_DIR=./uploads
PDF_DIR=./pdfs
MAX_FILE_SIZE=10485760
# 数据库配置
DB_PATH=./data/pdf_history.db
# 清理服务配置
CLEANUP_RETENTION_HOURS=24
CLEANUP_AUTO_ENABLED=true主要配置文件: miniprogram/config/config.js
const config = {
app: {
limits: {
maxImages: 20, // 最大图片数量
maxImageSize: 10 * 1024 * 1024, // 单张图片最大10MB
maxTotalSize: 50 * 1024 * 1024, // 总大小限制50MB
compressQuality: 0.8, // 压缩质量
compressThreshold: 2 * 1024 * 1024 // 2MB以上压缩
},
timeout: {
request: 30000, // 请求超时30秒
upload: 120000, // 上传超时2分钟
generate: 300000 // PDF生成超时5分钟
}
}
}- 选择图片: 点击"选择照片"从相册选择图片
- 预览编辑: 查看选中的图片,可删除不需要的
- 开始生成: 点击"生成PDF"开始处理
- 等待处理: 查看上传和生成进度
- 预览下载: 生成完成后预览PDF并下载保存
POST /api/auth/login- 用户登录认证POST /api/file/upload- 图片文件上传POST /api/pdf/generate- 生成PDF请求GET /api/pdf/status/:taskId- 查询生成状态GET /api/pdf/download/:taskId- 下载PDF文件GET /api/pdf/history- 获取历史记录
# 启动后端服务
cd server
npm run dev
# 使用微信开发者工具打开前端项目
# 导入 miniprogram 目录- 使用微信开发者工具的调试面板
- 查看 Network 面板监控API请求
- 使用真机调试测试完整功能
- 检查 Console 面板的日志输出
- 图片选择失败: 检查相册访问权限
- 上传失败: 检查网络连接和服务器状态
- PDF预览失败: 确认微信版本支持文档预览
- 文件保存失败: 检查存储权限设置
MIT License
欢迎提交 Issue 和 Pull Request 来改进项目。
- 智能压缩: 自动检测图片大小,超过2MB自动压缩
- 实时反馈: 上传进度、生成状态实时显示
- 错误恢复: 网络异常自动重试,操作失败友好提示
- 缓存机制: 智能缓存减少重复请求
- 分片上传: 大文件分片上传,提高成功率
- 并发处理: 服务端支持多任务并发处理
- 资源清理: 自动清理过期文件,节省存储空间
- 集群部署: PM2集群模式,提高并发处理能力
- 文件验证: 严格的文件格式和大小验证
- 权限控制: 用户数据隔离,确保隐私安全
- HTTPS支持: 全程加密传输
- 定期清理: 自动清理临时文件和过期数据
# 查看应用日志
pm2 logs pdf-generator
# 查看错误日志
pm2 logs pdf-generator --err
# 查看实时日志
pm2 logs pdf-generator --lines 100# 查看进程状态
pm2 status
# 查看详细信息
pm2 show pdf-generator
# 重启应用
pm2 restart pdf-generator
# 重载应用 (零停机)
pm2 reload pdf-generator# 进入数据库目录
cd server/data
# 查看数据库文件
ls -la pdf_history.db
# 备份数据库
cp pdf_history.db pdf_history_backup_$(date +%Y%m%d).db# 检查端口占用
netstat -tlnp | grep 1919
# 检查PM2状态
pm2 status
# 查看错误日志
pm2 logs pdf-generator --err- 检查
uploads目录权限 - 确认文件大小限制配置
- 检查磁盘空间是否充足
- 检查
pdfs目录权限 - 确认 pdf-lib 依赖正常安装
- 查看服务器内存使用情况
- 检查服务器域名配置
- 确认微信小程序后台域名白名单
- 验证SSL证书是否有效
# 增加文件描述符限制
echo "* soft nofile 65536" >> /etc/security/limits.conf
echo "* hard nofile 65536" >> /etc/security/limits.conf
# 优化内核参数
echo "net.core.somaxconn = 65535" >> /etc/sysctl.conf
sysctl -p- 调整PM2集群实例数量
- 配置适当的内存限制
- 启用Nginx gzip压缩
- 配置静态文件缓存
- 图片编辑功能 (裁剪、旋转、滤镜)
- PDF密码保护
- 批量处理多个PDF
- 云存储集成 (阿里云OSS、腾讯云COS)
- 用户账号系统
- 高级PDF编辑功能
- 模板系统
- 水印添加功能
- 迁移到TypeScript
- 引入Redis缓存
- 实现WebSocket实时通信
- 添加单元测试
- 集成CI/CD流水线
- 容器化部署 (Docker)
详细的API接口文档请参考 server/routes/ 目录下的各个路由文件。
- v1.0.0 (2024-01-01)
- 初始版本发布
- 基础PDF生成功能
- 微信小程序客户端
- 历史记录管理
如有问题或建议,请通过以下方式联系:
- 提交 GitHub Issue
- 发送邮件至项目维护者
感谢以下开源项目的支持:
- pdf-lib - PDF生成库
- Express.js - Web框架
- better-sqlite3 - SQLite数据库
- PM2 - 进程管理器