首页 > 解决方案 > html2canvas 和 jsPDF,promise 错误,createObjectURL 不是函数

问题描述

我正在使用一项功能,该功能从 Bootstrap 模式中获取内容,将其保存为 PDF 并将文件下载到我的本地 PC。

这是我的 HTML 和 listItem.js 文件的摘录

function downloadPDF() {
  // some stuff

  html2canvas($("#printItems")[0], {
    allowTaint: true
  }).then(function(canvas) {
    var imgData = canvas.toDataURL('image/jpeg, 1.0');
    var pdf = jsPDF({
      unit: 'mm',
      format: 'a4',
      orientation: 'portrait'
    });

    pdf.addImage(imgData, 'jpeg', 15, 2);
    pdf.save('test.pdf');
  });
}
<div class="modal-body" id="printItems">
  <div class="container" id="selectedItems"></div>  
</div>

<script type="text/javascript" src="/library/html2canvas.min.js"></script>
<script type="text/javascript" src="/library/jspdf.min.js"></script>

我遇到的问题是当我点击pdf.save('test.pdf')函数失败并且我收到以下错误:

Uncaught(in promise) TypeError: l(...).createObjectURL is not a function

我不确定我在这里做错了什么。另外,我正在使用 jsPDF 1.5.3 版和 html2canvas 1.1.4 版

标签: javascripthtmljqueryjspdfhtml2canvas

解决方案


这是一个非常奇怪的问题,但我发现了问题所在,这与我使用的 jspdf 或 html2canvas 版本无关。出于某种原因,jspdf 不喜欢我在其他两个脚本中引用 URL。一旦我删除了实际的 URL(https)并且只有物理路径它工作正常。我在寻找版本控制并找出编写承诺的不同方法时走错了路。大声笑和SMH

我上面发布的代码现在可以工作了。


推荐阅读