reactjs - react-pdf 无法呈现 base64 PDF 数据,解释为十六进制字符串

标签 reactjs pdf react-pdf

我正在尝试使用 react-pdf 库来显示 base64 编码的 PDF 文件。 B64 数据是准确的,因为它加载在 iframe 中:

 <iframe
   className={css.previewIframe}
   src={`data:application/pdf;base64,${
     this.props.encodedPdf
   }`}
 />

但是,如果我将数据直接插入到 react-pdf 文档中,则会出现错误:

<Document file={this.props.encodedPdf} />

文档呈现错误消息 Failed to load PDF file.,并且控制台记录以下错误:InvalidPDFException {name: "InvalidPDFException", message: "Invalid PDF structure "

我还收到很多警告,如下所示:警告:忽略十六进制字符串中的无效字符“109”

sti

documentation明确指出 file prop 可以是 B64 编码的内容。关于问题可能是什么的任何想法?如果需要,这里是 B64 数据:

JVBERi0xLjMKMSAwIG9iago8PAovS2lkcyBbIDMgMCBSIF0KL1R5cGUgL1BhZ2VzCi9Db3VudCAxCj4+CmVuZG9iagoyIDAgb2JqCjw8Ci9Qcm9kdWNlciAoUHlQREYyKQo+PgplbmRvYmoKMyAwIG9iago8PAovQ29udGVudHMgNSAwIFIKL1JvdGF0ZSAwCi9UeXBlIC9QYWdlCi9SZXNvdXJjZXMgPDwKL1Byb2NTZXQgWyAvUERGIC9UZXh0IF0KPj4KL0Nyb3BCb3ggWyAwIDAgNjEyIDc5MiBdCi9QYXJlbnQgMSAwIFIKL01lZGlhQm94IFsgMCAwIDYxMiA3OTIgXQo+PgplbmRvYmoKNCAwIG9iago8PAovVHlwZSAvQ2F0YWxvZwovUGFnZXMgMSAwIFIKPj4KZW5kb2JqCjUgMCBvYmoKPDwKL0xlbmd0aCAxMAovRmlsdGVyIC9GbGF0ZURlY29kZQo+PgpzdHJlYW0KSIkCCDAAAAAAAQplbmRzdHJlYW0KZW5kb2JqCnhyZWYKMCA2CjAwMDAwMDAwMDAgNjU1MzUgZiAKMDAwMDAwMDAwOSAwMDAwMCBuIAowMDAwMDAwMDY4IDAwMDAwIG4gCjAwMDAwMDAxMDggMDAwMDAgbiAKMDAwMDAwMDI3MyAwMDAwMCBuIAowMDAwMDAwMzIyIDAwMDAwIG4gCnRyYWlsZXIKPDwKL1NpemUgNgovUm9vdCA0IDAgUgovSW5mbyAyIDAgUgo+PgpzdGFydHhyZWYKNDAzCiUlRU9GCg==

如果我将 data:application/pdf;base64, 添加到字符串的开头,则不会出现错误,但也不会呈现任何内容。

最佳答案

问题是:

  1. 我需要 data:application/pdf;base64,在字符串前面
  2. 我的组件中没有组件。参见 https://github.com/wojtekmaj/react-pdf/issues/203

关于reactjs - react-pdf 无法呈现 base64 PDF 数据,解释为十六进制字符串,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62140213/

相关文章:

java - Java 的 iText 库中的对齐

perl - 如何将完整的 CGI 表单呈现为 PDF?

javascript - react-pdf 安装时的 webpack 插件错误

reactjs - react pdf重复故障

reactjs - 如何在每个 Action 中发出事件

javascript - nextjs 的生产 URL

javascript - 在组件之间传递状态

reactjs - 如何在 useEffect 中使用 setState 进行 API 调用后执行函数?

pdf - 如何将具有透明度的 PNG 添加到 PDF?

javascript - Highcharts-React 获取图表的 Base64 PNG