如何在 Chrome 浏览器中使用 iframe 标签显示 PDF 文件。

huangapple go评论82阅读模式
英文:

How to display pdf file in chrome browser in iframe tag

问题

我有一个URL,它返回一个文件,但问题是在Firefox浏览器中,文件显示正常,但在Chrome和Edge浏览器中,它会下载而不是显示。我搜索的所有解决方案都没有正确解决这个问题,请指导我。

<iframe 
  style={style} width="100%" height="100%"
  src={`/test?letterReference=${this.props.letterReference}&fileReference=${this.props.fileReference}#toolbar=0&navbar=0`}>
</iframe>
英文:

I have a url that returns a file, but the problem is that in the Firefox browser, the file is displayed correctly, but in the Chrome and Edge browsers, it downloads instead of displaying. None of the solutions I searched for solve this problem correctly, please. guide me

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-html -->

&lt;iframe 

style={style} width="100%" height="100%"
src={/test?letterReference=${this.props.letterReference}&amp;fileReference=${this.props.fileReference}#toolbar=0&amp;navbar=0}>
</iframe>

<!-- end snippet -->

答案1

得分: 1

要显示一个文件,您还可以使用<object>

<object data="{`/test?letterReference=${this.props.letterReference}&fileReference=${this.props.fileReference}#toolbar=0&navbar=0`}" width="100%" height="100%"></object>
英文:

To display a file you could also use an &lt;object&gt;:

&lt;object data=&quot;{`/test?letterReference=${this.props.letterReference}&amp;fileReference=${this.props.fileReference}#toolbar=0&amp;navbar=0`}&quot; width=&quot;100%&quot; height=&quot;100%&quot;&gt;&lt;/object&gt;

huangapple
  • 本文由 发表于 2023年7月10日 18:38:37
  • 转载请务必保留本文链接:https://go.coder-hub.com/76652923.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定