Question

我正在尝试生成PDF以在我点击按钮时显示订单的收据。我正在使用jsPDF和React。当我调用外部PDF时，我实现了显示pdf，但是当我将数据作为字符串传递时，它显示以下错误：

GET data:application/pdf;base64,
JVBERi0xLjMKMyAwIG9iago8PC9UeXBlIC9QYWdlCi9QYXJ…
l6ZSAyMAovUm9vdCAxOSAwIFIKL0luZm8gMTggMCBSCj4+
CnN0YXJ0eHJlZgoxOTYzCiUlRU9G net::ERR_INVALID_URL

就像iframe将SRC属性识别为URL而不是PDF文档。这是按下按钮时调用的函数：

handlePrintReceipt() {
  let pdfConverter = require('jspdf');
  let doc = new pdfConverter('p','pt','c6');

  doc.text('Simple text', 10, 10);
  let data = doc.output('datauristring');

  let iframe = `<iframe type="application/pdf" src="${data}#toolbar=0&navpanes=0" width="100%" height="450" frameborder="0"></iframe>`;

  this.setState({
    outputReceipt: iframe
  });
}

当我使用之前保存的简单PDF文档更改iframe的SRC属性时（例如：'simple_text.pdf'），此实现工作正常。

我做错了什么？提前谢谢

Answer 1

我刚刚将您的 outputReceipt 添加到了一个 risklySetInnerHTML

<div dangerouslySetInnerHTML={{ __html: this.state.outputReceipt}}/>

并且有效

在iframe中显示src作为datastring pdf不起作用（React - jspdf）

1 个答案: