纯前端 PNG/JPG 转 PDF 工具(无需服务器,源码分享)

纯前端 PNG/JPG 转 PDF 工具(无需服务器,源码分享)

纯前端 PNG/JPG 转 PDF 工具(无需服务器,源码分享)

✨ 一个完全运行在浏览器中的图片转 PDF 工具,不依赖后端、不上传文件、保护隐私,支持拖拽、排序、预览、批量导出,代码开源,一键部署!

🌐 在线演示

👉 https://longsongline.github.io/png-to-pdf/

在这里插入图片描述

打开即可使用,无需注册、无需登录,所有处理都在你的浏览器中完成!


📦 功能特性

  • 纯前端实现:基于 jsPDF + FileReader,无任何服务端依赖
  • 隐私安全:图片不会上传到任何服务器,全程本地处理
  • 多格式支持:PNG、JPG、BMP、TIFF、SVG(自动转 PNG)
  • 灵活输出
    • 合并为单个 PDF(每张图一页)
    • 每张图生成独立 PDF
  • 交互友好
    • 拖拽上传 / 点击选择
    • 图片预览(带缩放)
    • 手动排序 / 按文件名排序
    • 删除选中 / 清空全部
    • 文件大小显示、操作日志提示

💻 使用方法

  1. 打开 在线工具
  2. 拖入或点击选择多张图片
  3. 调整顺序(可选)
  4. 选择输出模式
  5. 点击「导出 PDF」即可下载!
⚠️ 首次加载会从 CDN 加载 jsPDF 库(约 100KB),请确保网络畅通。

🧩 技术实现

  • 核心库jsPDF v2.5.1
  • 编码规范:UTF-8(避免中文乱码)
  • 兼容性:现代浏览器(Chrome / Edge / Firefox / Safari)

关键逻辑:

  • 使用 FileReader 读取本地文件为 DataURL
  • SVG 自动转为 PNG 再嵌入 PDF
  • 利用 addPage() 实现多页布局
  • 响应式 UI + 拖拽排序 + 图片预览模态框

📂 源码 & 部署

🔗 GitHub 仓库

🚀 如何部署自己的版本?

  1. Fork 本仓库
  2. 进入仓库 → Settings → Pages
  3. 设置 Source 为 main 分支 + / (root)
  4. 保存,等待 1 分钟
  5. 访问:https://你的用户名.github.io/png-to-pdf/
💡 完全免费!GitHub Pages 自动提供 HTTPS。

📝 注意事项

  • 中文乱码问题
    请确保 index.htmlUTF-8 无 BOM 编码保存(推荐直接在 GitHub 网页编辑器修改)。
  • 大图处理慢
    浏览器内存有限,建议单图不超过 10MB。
  • PDF 分辨率
    默认按 A4 尺寸居中缩放,保持原始比例。

❤️ 开源协议

本项目为 MIT 协议,欢迎 Fork、Star、提 PR!

如果你觉得有用,欢迎点赞 👍 或分享给需要的朋友!


作者:longsongline
更新时间:2026年3月
关键词:前端工具、图片转PDF、纯前端、jsPDF、GitHub Pages、无后端

Read more

找回 Edge 边栏中消失的 Copilot 图标

Edge 边栏的 Copilot 能根据网页内容增强回复,相当于内置了RAG,而且能不限次数使用GPT-5,非常方便。笔者有次打开 Edge 浏览器时发现边栏的Copilot图标消失了,探索了一些方法后终于找到解决方案,以下: 1. win+R 打开运行,输入 powershell 打开,复制以下正则表达式全文到powershell 命令窗口回车运行即可。命令窗口出现“✅ 已将 variations_country 设置为 US。已重新启动 Microsoft Edge”代表已经成功。 & { # 关闭所有 Edge 进程 Get-Process | Where-Object { $_.ProcessName -like "msedge*" } | Stop-Process -Force -ErrorAction SilentlyContinue Start-Sleep -Seconds 3 $localState

开源安全模型哪家强?Qwen3Guard-Gen-8B vs Llama Guard 2横评

开源安全模型哪家强?Qwen3Guard-Gen-8B vs Llama Guard 2横评 在生成式AI迅猛发展的今天,大模型“说错话”的代价正变得越来越高。从智能客服无意中输出歧视性言论,到内容平台因用户生成违法信息被监管处罚,安全失控的案例屡见不鲜。传统的关键词过滤早已形同虚设——攻击者只需把“炸弹”写成“炸dan”,就能轻松绕过规则系统。真正的挑战在于:如何让机器理解语义背后的意图? 正是在这种背景下,专用安全大模型应运而生。它们不再依赖静态规则,而是像一位经验丰富的审核员,能结合上下文判断一句话到底是不是“有问题”。其中,Meta的 Llama Guard 2 和阿里云推出的 Qwen3Guard-Gen-8B 成为开源领域最受关注的两个代表。两者都试图解决同一个核心问题:如何让AI既保持开放性,又不至于“口无遮拦”。 但它们走的是不同的技术路径。Llama Guard 系列延续了轻量、高效的设计哲学,适合快速部署;而 Qwen3Guard-Gen-8B 则更进一步,采用生成式范式,追求深度语义理解与可解释性。

【GitHub开源AI精选】WhisperX:70倍实时语音转录、革命性词级时间戳与多说话人分离技术

【GitHub开源AI精选】WhisperX:70倍实时语音转录、革命性词级时间戳与多说话人分离技术

系列篇章💥 No.文章1【GitHub开源AI精选】LLM 驱动的影视解说工具:Narrato AI 一站式高效创作实践2【GitHub开源AI精选】德国比勒费尔德大学TryOffDiff——高保真服装重建的虚拟试穿技术新突破3【GitHub开源AI精选】哈工大(深圳)& 清华力作 FilmAgent:剧本自动生成 + 镜头智能规划,开启 AI 电影制作新时代4【GitHub开源AI精选】Lumina - Image 2.0 文生图模型,以小参数量实现高分辨率多图生成新突破5【GitHub开源AI精选】探索 Mobile-Agent:X-PLUG 推出的创新型移动智能操作代理6【GitHub开源AI精选】吴恩达团队开源VisionAgent:用自然语言开启计算机视觉新时代7【GitHub开源AI精选】Oumi:一站式AI开发平台,涵盖训练、评估与部署全流程8【GitHub开源AI精选】深入剖析RealtimeSTT:开源实时语音转文本库的强大功能与应用9【GitHub开源AI精选】PodAgent:多智能体协作播客生成框架,

万方AIGC检测通不过?这几款降AI工具实测有效

万方AIGC检测通不过?这几款降AI工具实测有效

万方AIGC检测通不过?这几款降AI工具实测有效 TL;DR:万方AIGC检测算法与知网、维普不同,需要选择支持万方平台的降AI工具。推荐嘎嘎降AI(多平台适配,4.8元/千字)和率降(稳定可靠,4.2元/千字)。 万方检测的特殊性 很多同学以为降AI工具都是通用的,用一个就能搞定所有平台。但实际上,知网、维普、万方三大平台的AIGC检测算法各有不同。我之前用一款只针对知网优化的工具处理论文,知网检测降到了8%,但万方一测还有32%,差点没过学校的检测线。 万方的AIGC检测更侧重于文本特征分析,对某些AI生成模式的识别与知网有差异。所以如果你学校用的是万方检测,一定要确认工具是否支持万方平台,别只看知网的效果数据。 支持万方的降AI工具对比 工具价格(千字)万方效果达标率特色链接嘎嘎降AI4.8元60%→8%99.26%多平台适配官网率降4.2元65%→12%97%稳定可靠官网去AIGC3.5元70%→18%96%通用型官网比话降AI8元知网专精99%