如何在 iFrame 中加载 PDF 文件？在 React 中工作

Question

我正在尝试在 REACT 中加载 iFrame 内的 pdf 文件，代码如下所示：

render(){
   return(
      <iframe
          sandbox="allow-same-origin allow-scripts allow-forms"
          title="PortletIFrameWidget"
          src={'.resources/crayola.pdf'}
          ref={(f) => { this.ifr = f }}
      />
   )
}

我收到警告：

资源解释为文档，但使用 MIME 类型 application/pdf 进行传输：“ http://localhost:8080/resources/crayola.pdf ”

但是当我转到链接：“ http://localhost:8080/resources/crayola.pdf ”时，我可以轻松地看到 PDF 的内容，因此存在 pdf 文件，问题是：它没有被上传/渲染iFrame。为什么？

这适用于 MOZILLA FIREFOX 和 EDGE，但不适用于 Chrome。

知道为什么会发生这种情况吗？以及如何在 REACT 中的 iFrame 中加载 PDF 文件

Answer 1

this has nothing to do with React, the problem obviously is in GOogle-Chrome. here's the solution I made:

<iframe src="./resources/crayola.pdf" title="title">
     Presss me: <a href="./resources/crayola.pdf">Download PDF</a>
</iframe>

and the link that helped me: PDFobject