一、问题产生：使用jspdf转换html到pdf清晰度不够

本人使用jspdf+html2canvas 清晰度达不到要求。采用放大画板，增加清晰度。但是与此同时生成的pdf文件过大，导致客户不满意。偶然发现使用压缩文件压缩后，一个十几M的文件可以压缩到100k不到。于是想到使用zip.js，下载的时候直接压缩为zip.既能提高效率，也能减少服务器存储压力

二、问题解决：在jspdf.debug.js源代码中下载部分集成zip.js

附zip.js下载地址
附我参考的demo地址
zip.js demo代码写的比较复杂。我只需要其中最关键的将文件转化为zip的代码。

将zip.js中的 zip.js zip-ext.js z-worker.js放入项目的lib包目录下并引入。
将deflate.js 和 z-worker.js放入项目入口html同级的目录下,这么做是因为zip.js中请求了该2个文件，找不到会报错；
修改js.pdf.debug.js第1131行左右，注释原有代码。添加如下代码。由于兼容性问题 ie可以不通过创建虚拟按钮的情况直接实现下载。为了兼容其他浏览器。需要在主页面中添加一个看不见的按钮。 我给他取了个id
download-btn-123
代码中我触发了虚拟事件实现下载。

附代码文本部分：

          var glob = getBlob();var name = options.split('.')[0];zip.createWriter(new zip.BlobWriter(), function (zipWriter) {zipWriter.add(options, new zip.BlobReader(glob), function () {zipWriter.close(function (blob) {if(typeof navigator.msSaveBlob == "function"){navigator.msSaveBlob(blob, name+'.zip');zipWriter = null;return;}var blobURL = URL.createObjectURL(blob);var clickEvent;clickEvent = document.createEvent("MouseEvent");clickEvent.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);var downloadButton = document.getElementById('download-btn-123');downloadButton.href = blobURL;downloadButton.download = name+"zip";downloadButton.dispatchEvent(clickEvent);creationMethodInput.disabled = false;fileList.innerHTML = "";zipWriter = null;});});}, onerror);

2022.6.3日（长期有效）：打个广告，苏州华为终端BG面向社会招聘人才，Java /C C++ / Python / Javascript 。有兴趣来苏州的同学们可以加我V 15850277051 ，走内推流程，有问必答！

jspdf与zip.js结合。解决转pdf文件清晰度与文件过大的问题相关推荐

将html doc转为pdf,js将html转换为pdf
js将html转换为pdf 所需引入文件 html2canvas和jsPdf.debug.js和jquery.min.js 贴代码: 点击下载 ,所需转换pdf的节点我所遇到的问题是没有左右边距,. ...
js将html转成pdf,js将html转换为pdf
js将html转换为pdf 所需引入文件 html2canvas和jsPdf.debug.js和jquery.min.js 贴代码: 点击下载 ,所需转换pdf的节点我所遇到的问题是没有左右边距,. ...
jsPdf+html2Canvas+react实现前端页面导出pdf，并解决jspdf分页图片过长截断问题
第一步在utils下面创建一个工具文件exportPDF.js 以下每一句代码都有对应的注释,并且针对不同情况,作出了相应的解释,如果有需要的话,请耐心看完. import html2Canvas ...
利用PDF.JS插件解决了本地pdf文件在线浏览问题（根据需要隐藏下载功能，只保留打印功能）
利用PDF.JS插件解决了本地pdf文件在线浏览问题(根据需要隐藏下载功能,只保留打印功能) 参考文章: (1)利用PDF.JS插件解决了本地pdf文件在线浏览问题(根据需要隐藏下载功能,只保留打印功 ...
最近很火的在线文件预览txt、doc、ppt、pdf、excel、jpg、png、zip、tar.gz等各种文件及压缩文件在线解压和预览，包括前后端设计和源码，编写搜索引擎多关键词检索名称和内容（五）
最近很火的在线文件预览txt.doc.ppt.pdf.excel.jpg.mp4.png.zip.tar.gz等各种文件及压缩文件在线解压和预览,包括前后端设计和源码,编写一个文件搜索引擎实现多关键词 ...
fis3+vue+pdf.js制作预览PDF文件或其他
人生第一篇博客,的确有点紧张,但有些许兴奋,因为这对于我来说应该是一个好的开始,以此励志在技术的道路上越走越远. 看过了多多少少的技术博客,给自己带来了很多技术上的收获,也因此在想什么时候自己也可以赠 ...
JS逐页转pdf文件为图片格式
背景年前的时候,开发一个电子杂志项目,功能需求是通过上传pdf文件,将其转为图片格式,所以杂志的内容其实就是一张张图片不过当时技术要求用后端实现,所以使用的是PHP实现该功能.项目完成后,寻思着在 ...
前端js html转换成pdf可下载打印；前端js可批量生成条形码；前端js可批量生成二维码，生成letter标签
注意:本文调试的是letter纸尺寸前端js html转换成pdf可下载打印 html2canvas + jspdf 前端js生成条形码 Options · lindell/JsBarcode ...
java实现html页面转pdf解决方案_[Java教程]纯js实现html转pdf
[Java教程]纯js实现html转pdf 0 2017-02-16 00:00:30 项目开发中遇到了一个变态需求,需要把一整个页面导出为pdf格式,而且要保留页面上的所有的表格.svg图片和样式. ...

jspdf与zip.js结合。解决转pdf文件清晰度与文件过大的问题

jspdf与zip.js结合。解决转pdf文件过大的问题

一、问题产生：使用jspdf转换html到pdf清晰度不够

二、问题解决：在jspdf.debug.js源代码中下载部分集成zip.js

jspdf与zip.js结合。解决转pdf文件清晰度与文件过大的问题相关推荐

最新文章

热门文章