前端使用pdf-lib库实现pdf合并，window.open预览合并后的pdf
最近出差开了好多发票，写了一个pdf合并网站，用于把多张发票pdf合并成一张，方便打印
使用pdf-lib这个库实现的pdf合并功能，预览使用的是浏览器自身查看pdf功能
源码
网页地址 https://zqy233.github.io/PDF-merge/
<!DOCTYPE html>
<html><head><title>PDF合并</title><script src="https://cdn.jsdelivr.net/npm/pdf-lib@1.17.1/dist/pdf-lib.min.js"></script></head><body><input type="file" id="fileInput" multiple /><button onclick="previewMergePDF()">预览合并的PDF</button><button onclick="downloadMergePDF()">下载合并的PDF</button><script>async function previewMergePDF() {const fileInput = document.getElementById("fileInput");const files = fileInput.files;if (files.length < 2) {alert("请至少选择两个PDF文件进行合并！");return;}// 创建一个新的PDF文档const mergedPdf = await PDFLib.PDFDocument.create();// 遍历选择的每个文件for (let i = 0; i < files.length; i++) {const file = files[i];const reader = new FileReader();// 读取文件内容const fileContents = await new Promise((resolve, reject) => {reader.onload = function (event) {resolve(event.target.result);};reader.onerror = function (event) {reject(new Error("文件读取错误。"));};reader.readAsArrayBuffer(file);});// 将PDF文件添加到合并的PDF文档中const pdf = await PDFLib.PDFDocument.load(fileContents);const copiedPages = await mergedPdf.copyPages(pdf,pdf.getPageIndices());copiedPages.forEach((page) => {mergedPdf.addPage(page);});}// 使用浏览器自带预览功能，预览合并后的PDFconst mergedPdfBytes = await mergedPdf.save();const mergedPdfBlob = new Blob([mergedPdfBytes], {type: "application/pdf",});const fileURL = URL.createObjectURL(mergedPdfBlob);window.open(fileURL);}async function downloadMergePDF() {const fileInput = document.getElementById("fileInput");const files = fileInput.files;if (files.length < 2) {alert("请至少选择两个PDF文件进行合并！");return;}const mergedPdf = await PDFLib.PDFDocument.create();for (let i = 0; i < files.length; i++) {const file = files[i];const reader = new FileReader();const fileContents = await new Promise((resolve, reject) => {reader.onload = function (event) {resolve(event.target.result);};reader.onerror = function (event) {reject(new Error("文件读取错误。"));};reader.readAsArrayBuffer(file);});const pdf = await PDFLib.PDFDocument.load(fileContents);const copiedPages = await mergedPdf.copyPages(pdf,pdf.getPageIndices());copiedPages.forEach((page) => {mergedPdf.addPage(page);});}const mergedPdfFile = await mergedPdf.saveAsBase64();const downloadLink = document.createElement("a");downloadLink.href = "data:application/pdf;base64," + mergedPdfFile;downloadLink.download = "merged.pdf";downloadLink.click();}</script></body>
</html>相关文章：
前端使用pdf-lib库实现pdf合并，window.open预览合并后的pdf
最近出差开了好多发票，写了一个pdf合并网站，用于把多张发票pdf合并成一张，方便打印 使用pdf-lib这个库实现的pdf合并功能，预览使用的是浏览器自身查看pdf功能 源码 网页地址 https://zqy233.github.io/PDF-merge/ <!DOCTYPE h…...
计算机网络相关知识点总结（二）
比特bit是计算机中数据量的最小单位,可简记为b。字节Byte也是计算机中数据量的单位,可简记为B,1B8bit。常用的数据量单位还有kB、MB、GB、TB等,其中k、M、G、T的数值分别为 2 10 2^{10} 210, 2 20 2^{20} 220, 2 30 2^{30} 230, 2 40 2^{40} 240。 K, M, G, T 分别对应以下…...
Redmine与Gitlab整合（实战版）
网上查了很多文章，总结一下。 安装过程略。可参考：(84条消息) Redmine与Gitlab功能集成_redmine gitlab_羽之大公公的博客-CSDN博客 配置集成的方法，参考： Redmine与GitLab集成 (ngui.cc) 修改ssh-key密码的方法，参…...
（3）深度学习学习笔记-简单线性模型
文章目录 一、线性模型二、实例1.pytorch求导功能2.简单线性模型（人工数据集） 来源 一、线性模型 一个简单模型：假设一个房子的价格由卧室、卫生间、居住面积决定，用x1，x2，x3表示。 那么房价y就可以认为yw…...
pytorch3d 安装报错 RuntimeError: Not compiled with GPU support pytorch3d
安装环境 NVIDIA GeForce RTX 3090 cuda 11.3 python 3.8.5 torch 1.11.0 torchvision 0.12.0 环境安装命令 conda install pytorch1.11.0 torchvision0.12.0 torchaudio0.11.0 cudatoolkit11.3 -c pytorch安装pytorch3d参考官网链接 https://github.com/facebookresearch/p…...
spring工程的启动流程？bean的生命周期？提供哪些扩展点？管理事务？解决循环依赖问题的？事务传播行为有哪些？
1.Spring工程的启动流程： Spring工程的启动流程主要包括以下几个步骤： 加载配置文件：Spring会读取配置文件（如XML配置文件或注解配置）来获取应用程序的配置信息。实例化并初始化IoC容器：Spring会创建并初…...
使用 Zabbix 监控 RocketMQ列举监控项和触发器
在使用 Zabbix 监控 RocketMQ 的过程中，以下是一些可能的监控项和触发器： 监控项 集群总体健康状况生产者和消费者的连接数量Broker 的状态消息的生产和消费速度队列深度（即队列中的消息数量）磁盘空间使用内存使用CPU使用网络流…...
uniApp：路由与页面跳转及传参
方式一：声明式导航 声明式导航，通过组件进行跳转。官方文档：详情 使用 navigator 组件进行页面跳转。 属性类型默认值说明urlString应用内的跳转链接，值为相对路径或绝对路径，如：“…/first/first”&#x…...
Java中操作文件(二)
目录 一、什么是数据流 二、InputStream概述 2.1、方法 2.2、说明 三、FileInputStream概述 3.1、构造方法 3.2、利用Scanner进行字符串读取，简化操作 四、OutputStream概述 4.1、方法 4.2、PrinterWriter简化写操作 五、小程序练习 示例1 示例…...
springboot+vue在线考试系统（java项目源码+文档）
风定落花生，歌声逐流水，大家好我是风歌，混迹在java圈的辛苦码农。今天要和大家聊的是一款基于springboot的在线考试系统。项目源码以及部署相关请联系风歌，文末附上联系信息 。 💕💕作者：风歌&a…...
样式方案：在 Vite 中接入现代化的 CSS 工程化方案
上一小节，我们使用 Vite 初始化了一个 Web 项目，迈出了使用 Vite 的第一步。但在实际工作中，仅用 Vite 官方的脚手架项目是不够的，往往还需要考虑诸多的工程化因素，借助 Vite 本身的配置以及业界的各种生态，…...
C#获取根目录实现方法汇总
以下是C#获取不同类型项目根目录的实现方法汇总，以及在 .NET Core 中获取项目根目录的方法： 控制台应用程序 string rootPath Environment.CurrentDirectory; string rootPath AppDomain.CurrentDomain.BaseDirectory; string rootPath Path.GetFul…...
vue获取当前坐标并通过天地图逆转码为省市区
因为需求需要获取用户当前的地理位置用于分析 通过原生的navigator.geolocation.getCurrentPosition获取经纬度 这个方法在谷歌浏览器会失效（原因未知），目前ie浏览器是可以获取的 getCurrentPosition() {if (navigator.geolocation) {var o…...
【MySQL】事务及其隔离性/隔离级别
目录 一、事务的概念 1、事务的四种特性 2、事务的作用 3、存储引擎对事务的支持 4、事务的提交方式 二、事务的启动、回滚与提交 1、准备工作：调整MySQL的默认隔离级别为最低/创建测试表 2、事务的启动、回滚与提交 3、启动事务后未commit，但是…...
计算机由于找不到d3dx9_35.dll，无法启动软件游戏的三个修复方法
在打开游戏的时候，计算机提示由于找不到d3dx9_35.dll，无法正常启动运行。这个是为什么呢？d3dx9_35.dll是DirectX 9.0里面的一个动态连结库文件，它包含了Direct3D、DirectPlay几个组件的二进制文件，为软件提供了多媒体图…...
第三章 模型篇：模型与模型的搭建
写在前面的话 这部分只解释代码，不对线性层(全连接层)，卷积层等layer的原理进行解释。 尽量写的比较全了，但是自身水平有限，不太确定是否有遗漏重要的部分。 教程参考： https://pytorch.org/tutorials/ https://githu…...
深度学习一些简单概念的整理笔记
大概看了一点动手学深度学习，简单整理一些概念。 一些问题 测试结果 Precision-Recall曲线定性分析模型精度average precision(AP) 平均精度 Precision ：检索出来的条目中有多大比例是我们需要的。 一些概念 损失函数（loss function&…...
Vue3中引入Element-plus
安装 npm install element-plus --save完整引入 打包后体积很大，适合学习，不适合生产。 此方法对于 vite 和 cli 脚手架创建的vue3均适用 // main.ts import { createApp } from vue //引入element-plus import ElementPlus from element-plus //引入…...
如何查看 Facebook 公共主页的广告数量上限？
作为Facebook的资深人员，了解如何查看公共主页的广告数量上限对于有效管理和优化广告策略至关重要。本文将详细介绍如何轻松查看Facebook公共主页的广告数量上限，以帮助您更好地掌握广告投放策略。 一、什么是Facebook公共主页的广告数量上限？…...
U-Boot移植 (2)- LCD 驱动修改和网络驱动修改
文章目录 1. LCD 驱动修改1.1 修改c文件配置1.2 修改h文件配置1.3 编译测试 2. 网络驱动修改2.1 I.MX6U-ALPHA 开发板网络简介2.2 网络 PHY 地址修改2.3 删除 uboot 中 74LV595 的驱动代码2.4 添加开发板网络复位引脚驱动2.5 更新 PHY 的连接状态和速度2.6 烧写调试2.7 测试一下…...
Ubuntu 23.10 现在由Linux内核6.3提供支持
对于那些希望在Ubuntu上尝试最新的Linux 6.3内核系列的人来说，今天有一个好消息，因为即将发布的Ubuntu 23.10（Mantic Minotaur）已经重新基于Linux内核6.3。 Ubuntu 23.10的开发工作于4月底开始，基于目前的临时版本Ubu…...
Python 学习之NumPy(一)
文章目录 1.为什么要学习NumPy2.NumPy的数组变换以及索引访问3.NumPy筛选使用介绍筛选出上面nb数组中能被3整除的所有数筛选出数组中小于9的所有数提取出数组中所有的奇数数组中所有的奇数替换为-1二维数组交换2列生成数值5—10，shape 为(3,5)的二维随机浮点数 NumP…...
Nftables栈溢出漏洞(CVE-2022-1015)复现
背景介绍 Nftables Nftables 是一个基于内核的包过滤框架，用于 Linux 操作系统中的网络安全和防火墙功能。nftables 的设计目标是提供一种更简单、更灵活和更高效的方式来管理网络数据包的流量。 钩子点（Hook Point） 钩子点的作用是拦截数…...
【C++】 Qt-事件（上）（事件、重写事件、事件分发）
文章目录 事件重写事件事件分发 事件 事件（event）是由系统或Qt本身在不同的时刻发出的。比如，当用户按下鼠标，敲下键盘，或窗口需要重新绘制的时候，都会发出一个相应的事件。一些事件是在对用户操作做出响应…...
k8s部署springboot
前言 首先以SpringBoot应用为例介绍一下k8s的部署步骤。 1.从代码仓库下载代码，比如GitLab； 2.接着是进行打包，比如使用Maven； 3.编写Dockerfile文件，把步骤2产生的包制作成镜像； 4.上传步骤3的镜像到远程…...
备战秋招002（20230704）
文章目录 前言一、今天学习了什么？二、关于问题的答案1.线程池2.synchronized关键字3、volatile 总结 前言 提示：这里为每天自己的学习内容心情总结； Learn By Doing，Now or Never，Writing is organized thinking. …...
游泳买耳机买什么的比较好，列举几款实战性好的游泳耳机
对于运动用户来说，在运动时都会选择听一些节奏感比较强的音乐，让自己运动是更有活力。现在已经是三伏天中的前伏期间，不少人会选择在三伏天的日子里进行减肥瘦身，耳游泳已经成为很多人都首选运动，游泳是非常好的有氧运…...
【无线传感器】使用 MATLAB和 XBee连续监控温度传感器无线网络研究（Matlab代码实现）
💥💥💞💞欢迎来到本博客❤️❤️💥💥 🏆博主优势：🌞🌞🌞博客内容尽量做到思维缜密，逻辑清晰，为了方便读者。 ⛳️座右铭&a…...
Java基础-多线程JUC-生产者和消费者
1. 生产者与消费者 实现线程轮流交替执行的结果； 实现线程休眠和唤醒均要使用到锁对象； 修改标注位（foodFlag）； 代码实现： public class demo11 {public static void main(String[] args) {/*** 需求&#…...
day2 QT按钮与容器
目录 按钮 1、QPushButton 2、QToolButton 3、QRadioButton 4、QCheckBox 示例 容器 编辑 1. QGroupBox（分组框） 2. QScrollArea（滚动区域） 3. QToolBox（工具箱） 4. QTabWidget（选…...