繁体   English   中英

使用 puppeteer 将 PDF 保存到文件

[英]Save PDF to File using puppeteer

我正在使用 puppeteer 使用 Fetch API 获取 PDF 并将文件保存到磁盘。

我正在尝试将 PDF 保存到磁盘上的文件,但是当我打开 pdf 时,我看到一个白屏。

在此处输入图片说明

在此处输入图片说明

!!编辑!!

在这里找到了解决方案https://github.com/GoogleChrome/puppeteer/issues/299#issuecomment-340199753

await page.pdf({ path: 'path/to/save/pdf', format: 'A4' });

这会将 PDF 保存到磁盘中。

由于您已经在使用 Puppeteer,因此将网页保存为 PDF 的最佳方法就是使用 Puppeteer 打开它,然后使用 Puppeteer API 保存 PDF。

page.pdf()函数就是这样做的。 请参阅文档

我假设通过使用fetch() ,您只下载getPdf.asp ,它本身不会产生有效的 PDF 响应流。 也许它只用客户端 HTML 响应,其中包括从某个远程资源获取 PDF 的脚本。

因此,我会尝试:

await page.goto(PDF_PAGE_URL);
const pdfBuffer = await page.pdf();
// process the buffer

希望能帮助到你!

后端


如果您将路径选项添加到page.pdf()它将直接保存到托管服务器的磁盘。

前端


如果您从服务器page.pdf()返回 pdf 缓冲区并将其发送到客户端/前端。 您将不得不处理pdf。

...
 const pdfBuffer = await page.pdf({
   printBackground: true,
   format: 'A4',
 });
 res.send(pdfBuffer);
...

假设您有一个/download路由,它将从page.pdf()page.pdf()选项返回 pdf 缓冲区。 在前端,您有一个 ID 为“下载”的按钮来处理流。 这是你将如何做到的

  1. 处理缓冲区
  2. 使用该缓冲区创建一个 ObjectURL。
  3. 创建一个将href指向对象 url a标记。
  4. 添加下载属性并模拟对该链接的虚假点击。
  5. 将下载按钮绑定到“点击”事件的处理函数。

代码

function handleClick() {
    fetch('/download')
        .then((res) => res.blob()) // --- 1.
        .then((readableStream) => {
            const blob = new Blob([readableStream], { type: 'application/pdf' }); // --- 1.
            blobToSaveAs('invoice', blob); // --- 2.
        })
        .catch((e) => console.error(e));
}

function blobToSaveAs(fileName, blob) {
    try {
        const url = window.URL.createObjectURL(blob); // --- 2.
        const link = document.createElement('a'); // --- 3.
        if (link.download !== undefined) {
            link.setAttribute('href', url); // --- 3.
            link.setAttribute('download', fileName); // --- 4.
            link.style.visibility = 'hidden';
            document.body.appendChild(link);
            link.click(); // --- 4.
            document.body.removeChild(link);
        }
    } catch (e) {
        console.error('BlobToSaveAs error', e);
    }
}

document.getElementById('download').addEventListener('click', handleClick); // --- 5.

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM