如何为客户提供PDF?

时间:2019-02-10 11:50:07

标签: node.js reactjs express pdf-generation

我试图从服务器获取生成的PDF文件(通过Pdfmake库),尽管我在chrome开发者控制台的预览和响应部分中获得了很长的base64代码,例如-

JVBERi0xLjMKJf////8KNyAwIG9iago8PAovVHlwZSAvRXh0R1N0YXRlCi9jYSAxCj4+CmVuZG9iago4IDAgb2JqCjw8Ci9UeXBlIC9FeHRHU3RhdGUKL2NhIDEKL0NBIDEKPj4KZW5kb2JqCjExIDAgKL0luZm8gMTMgMCBSCi9JRCBbPGIzZjEyYjhkYWYwN2Q4ZWZkZjFjYTkzOWE3YTQ2NjZiPiA8YjNmMTJiOGRhZjA3ZDhlZmRmMWNhOTM5YTdhNDY2NmI+XQo+PgpzdGFydHhyZWYKMjA5Nj。 ............很长....

我希望在新的浏览器窗口标签上获取pdf, 在手动键入前缀为data:application/pdf;base64,的base64代码之后,然后显示pdf ,但是我需要在onClick发生后立即在新标签上弹出...

data:application/pdf;base64,JVBERi0xLjMKJf////8KNyAwIG9iago8PAovVHlwZSAvRXh0R1N0YXRlCi9jYSAxCj4+CmVuZG9iago4IDAgb2JqCjw8Ci9UeXBlIC9FeHRHU3RhdGUKL2NhIDEKL0NBIDEKPj4KZW5kb2JqCjExIDAgb2JqCjw8Ci9UeXBlIC9FeHRHU3RhdGUKL0NBIDEKPj4KZW5kb2JqgKI189+A10wPsfByPuXwnyXtcO17zDJBaRJTFEFLPpHqYmHEniQ7Wjpe/E/iXwbhHf8B6XIZX4gskibxEvuIM8G8E9zIfwk/kt/OfCYXCcuFT4YxqlOp11Tl1sVrSxGlqNa9pftQO1oo

请回答尽可能简单和详细,我不知道流,缓冲区,base64,文件系统如何正常工作以及如何使用,我是开发人员。

客户端 --->

handleOrderInvoice(event) {
const orderid = event.currentTarget.id;
fetch(`/api/payment/order/${orderid}`, {
  method: "GET",
  headers: {
    Accept: "application/pdf",
    Authorization: localStorage.getItem("bearerToken")
  }
})
  .then(response => {

    //HOW to work with pdf response???

  })
  .catch(err => console.log(`Error in fetching this order. -- ${err}`));

服务器端(快速)->

    router.get(
  "/order/:orderid",
  passport.authenticate("jwt", { session: false }),
  (req, res) => {
        //Create PDF Document
        const pdfDoc = pdfMake.createPdf(documentDefinition);
        pdfDoc.getBase64(data => {
          res.writeHead(200, {
            "Content-Type": "application/pdf",
            "content-Disposition": "inline; filename='invoice.pdf'"
          });
          const doc = Buffer.from(data.toString("utf-8"), "base64");
          res.end(doc);
        });
      })
      .catch(err =>
        console.log(`Error in fetching user order response. -- ${err}`)
      );
  }
);

1 个答案:

答案 0 :(得分:1)

pdf,图像通常不存储在base64中,因为这些文件的大小可能很大。 而是使用文件系统进行存储,因为它更便宜(您无需来回转换)

假设您已将pdf存储在文件系统中,则只需使用

response.sendFile(url-for-pdf);

您可以打开一个新窗口,使用

在客户端显示pdf
window.open('_link is here_', '_blank');