如何在 blob url 上设置下载文件名 html2pdf.js

Question

我正在使用html2pdf.js

我应该在客户下载文件之前显示预览。

'dataurlnewwindow'的方式可以显示预览，但是下载按钮不起作用。

所以我更改了 bloburl 输出，并且下载按钮正常工作。

但是当我点击下载时，我想设置下载文件名。

如下所示，我无法设置下载文件名。

有谁知道如何处理吗？

这是我使用的 html2pdf.js 代码。

const opt = { margin: 10, filename, html2canvas: { width: 800, useCORS: true } };
html2pdf().set(opt).from(html).output('bloburl').then(r => { window.open(r) })

连你们都知道支持预览和带名字下载，请告诉我。我需要帮助

Answer 1

您应该尝试在

<a>

属性中的

download

标签处设置文件名。

html2pdf().from(html)
          .set(opt)
          .toPdf()
          .get('pdf')
          .then((pdf) => downloadPdf(pdf, options));

const downloadPdf = (pdf, opt) => {
    let link = document.createElement('a');
    link.target = '_blank';
    link.href = pdf.output('bloburl');
    link.download = 'myFileName.pdf';
    link.click();
    link.remove();
}

这将在新标签页中打开 PDF，因为

target=_blank

并在

click()

标签元素上的

<a>

事件之后立即下载它。

Answer 2

仅在代码中的 .save('your file name.pdf') 中设置文件名。只是它 常量 html2pdf(document.getElementById('element')).save(

${order_number.innerHTML}.pdf

)