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

时间：2024-10-04 07:33:58

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

  • 一、问题产生：使用jspdf转换html到pdf清晰度不够
  • 二、问题解决：在源代码中下载部分集成

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

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

二、问题解决：在源代码中下载部分集成

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

  1. 将中的 放入项目的lib包目录下并引入。在这里插入图片描述

  2. 将 和 放入项目入口html同级的目录下,这么做是因为中请求了该2个文件，找不到会报错；

  3. 修改第1131行左右，注释原有代码。添加如下代码。由于兼容性问题 ie可以不通过创建虚拟按钮的情况直接实现下载。为了兼容其他浏览器。需要在主页面中添加一个看不见的按钮。 我给他取了个id
    download-btn-123
    代码中我触发了虚拟事件实现下载。

    在这里插入图片描述

附代码文本部分：

          var glob = getBlob();
          var name = ('.')[0];
          (new (), function (zipWriter) {
            (options, new (glob), function () {
              (function (blob) {

                if(typeof  == "function")
                {
                  (blob, name+'.zip');
                  zipWriter = null;
                  return;
                }

                var blobURL = (blob);
                var clickEvent;
                clickEvent = ("MouseEvent");
                ("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
                var downloadButton = ('download-btn-123');
                 = blobURL;
                 = name+"zip";
                (clickEvent);
                 = false;
                 = "";
                zipWriter = null;
              });
            });
          }, onerror);
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27

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

相关文章