在 iframe 中显示 src 作为数据字符串 pdf 不起作用（React - jspdf）

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 文档（如：'simple_text.pdf'）更改 iframe 的 SRC 属性时，此实现工作正常。

我做错了什么？ 提前致谢

Answer 1

我刚刚将您的 outputReceipt 添加到了一个危险的SetInnerHTML

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

和作品