If I'm not mistaken, Google Docs offers the means to display a PDF that is stored on the same server as the web page via an iFrame, but I need to know how I can do this in a cross-browser compliant way.
如果我没弄错的话,谷歌文档提供了显示PDF的方法,它通过iFrame存储在与web页面相同的服务器上,但是我需要知道如何以跨浏览器兼容的方式实现这一点。
8 个解决方案
#1
142
You could consider using PDFObject by Philip Hutchison.
你可以考虑使用Philip Hutchison的PDFObject。
Alternatively, if you're looking for a non-Javascript solution, you could use markup like this:
或者,如果您正在寻找非javascript解决方案,您可以使用如下标记:
<object data="myfile.pdf" type="application/pdf" width="100%" height="100%">
<p>Alternative text - include a link <a href="myfile.pdf">to the PDF!</a></p>
</object>
#2
20
PDF.js is an HTML5 technology experiment that explores building a faithful and efficient Portable Document Format (PDF) renderer without native code assistance. It is community-driven and supported by Mozilla Labs.
PDF。js是一个HTML5技术的实验,它探索在没有本地代码帮助的情况下构建一个忠实而高效的可移植文档格式(PDF)呈现程序。它是社区驱动的,由Mozilla实验室支持。
You can see the demo here.
你可以在这里看到演示。
#3
11
This might work a little better this way
这样做可能会好一点。
<embed src= "MyHome.pdf" width= "500" height= "375">
#4
9
If I'm not mistaken, the OP was asking (although later accepted a .js solution) whether Google's embedded PDF display server will display a PDF on his own website.
如果我没弄错的话,OP询问(尽管后来接受了.js解决方案)谷歌的嵌入式PDF显示服务器是否会在自己的网站上显示PDF。
So, one and a half years later: yes, it will.
因此,一年半后:是的,它会。
See http://googlesystem.blogspot.ca/2009/09/embeddable-google-document-viewer.html. Also, see https://docs.google.com/viewer, and plug in the URL of the file you want to display.
见http://googlesystem.blogspot.ca/2009/09/embeddable-google-document-viewer.html。另外,请参见https://docs.google.com/viewer,并插入要显示的文件的URL。
Edit: Re-reading, OP was asking for solutions that don't use iFrames. I don't think that's possible with Google's viewer.
编辑:重新阅读,OP要求不使用iframe的解决方案。我认为这对于谷歌的观众来说是不可能的。
#5
4
have a try with Flex Paper http://flexpaper.devaldi.com/
试试Flex Paper http://flexpaper.devaldi.com/
it works like scribd
它的工作原理就像scribd
#6
3
Be sure to test any solution across different Reader preferences. A site visitor may have their browser set to open the PDF in Reader/Acrobat as opposed to the browser, e.g., by disabling the Acrobat plugin in Firefox..
确保在不同的阅读器首选项之间测试任何解决方案。网站访问者可以设置浏览器打开PDF阅读器/Acrobat,而不是浏览器,例如,禁用Firefox中的Acrobat插件。
I can't be sure of my results, because I have two different Acrobat plugins that Firefox recognizes due to my having different versions of Adobe Acrobat and Adobe Reader, but it does appear that you at least need to test what happens if a website visitor has their browser set to not open the PDF in the browser. It could be quite annoying when they look at what appears to be an otherwise usable web page and their browser is nagging them to open a PDF file that they think they didn't request. In some cases, the PDF file spontaneously opened in Adobe Reader, not the browser, and in other cases the browser threw up a dialog saying the file didn't exist.
我不确定我的结果,因为我有两个不同的Acrobat Firefox插件,认识到由于我有不同版本的Adobe Acrobat阅读器,但它确实表明你至少需要测试如果一个网站访问者浏览器设置为没有在浏览器中打开PDF。当他们看到一个看似可用的网页,而他们的浏览器却在唠叨着要他们打开一个他们认为自己没有请求的PDF文件时,这可能会很烦人。在某些情况下,PDF文件是在adobereader而不是浏览器中自动打开的,在其他情况下,浏览器会弹出一个对话框,说该文件不存在。
I ran into such mismatches with iframe and object both, different issues for different code.
我遇到了与iframe和object都不匹配的问题,不同的代码有不同的问题。
This is for simple HTML code. I haven't tried the suggested frameworks.
这是简单的HTML代码。我还没有尝试建议的框架。
#7
0
pdf2htmlEX by coolwanglu is probably the best solution out there to convert a pdf file into html. You could do a simple convert and then embed the html page as an iframe or something similar.
coolwanglu的pdf2htmlEX可能是将pdf文件转换成html的最佳解决方案。您可以进行简单的转换,然后将html页面嵌入到iframe或类似的东西中。
#8
0
I would really opt for FlowPaper, especially their new Elements mode that can be found here : https://flowpaper.com/demo/
我真的会选择FlowPaper,尤其是它们的新元素模式,可以在这里找到:https://flowpaper.com/demo/
It flattens the PDFs significantly at the same time as keeping text sharp which means that it will load much faster on mobile devices
它在保持文本锐化的同时,使pdf文件变得更平滑,这意味着它在移动设备上的加载速度会更快。
#1
142
You could consider using PDFObject by Philip Hutchison.
你可以考虑使用Philip Hutchison的PDFObject。
Alternatively, if you're looking for a non-Javascript solution, you could use markup like this:
或者,如果您正在寻找非javascript解决方案,您可以使用如下标记:
<object data="myfile.pdf" type="application/pdf" width="100%" height="100%">
<p>Alternative text - include a link <a href="myfile.pdf">to the PDF!</a></p>
</object>
#2
20
PDF.js is an HTML5 technology experiment that explores building a faithful and efficient Portable Document Format (PDF) renderer without native code assistance. It is community-driven and supported by Mozilla Labs.
PDF。js是一个HTML5技术的实验,它探索在没有本地代码帮助的情况下构建一个忠实而高效的可移植文档格式(PDF)呈现程序。它是社区驱动的,由Mozilla实验室支持。
You can see the demo here.
你可以在这里看到演示。
#3
11
This might work a little better this way
这样做可能会好一点。
<embed src= "MyHome.pdf" width= "500" height= "375">
#4
9
If I'm not mistaken, the OP was asking (although later accepted a .js solution) whether Google's embedded PDF display server will display a PDF on his own website.
如果我没弄错的话,OP询问(尽管后来接受了.js解决方案)谷歌的嵌入式PDF显示服务器是否会在自己的网站上显示PDF。
So, one and a half years later: yes, it will.
因此,一年半后:是的,它会。
See http://googlesystem.blogspot.ca/2009/09/embeddable-google-document-viewer.html. Also, see https://docs.google.com/viewer, and plug in the URL of the file you want to display.
见http://googlesystem.blogspot.ca/2009/09/embeddable-google-document-viewer.html。另外,请参见https://docs.google.com/viewer,并插入要显示的文件的URL。
Edit: Re-reading, OP was asking for solutions that don't use iFrames. I don't think that's possible with Google's viewer.
编辑:重新阅读,OP要求不使用iframe的解决方案。我认为这对于谷歌的观众来说是不可能的。
#5
4
have a try with Flex Paper http://flexpaper.devaldi.com/
试试Flex Paper http://flexpaper.devaldi.com/
it works like scribd
它的工作原理就像scribd
#6
3
Be sure to test any solution across different Reader preferences. A site visitor may have their browser set to open the PDF in Reader/Acrobat as opposed to the browser, e.g., by disabling the Acrobat plugin in Firefox..
确保在不同的阅读器首选项之间测试任何解决方案。网站访问者可以设置浏览器打开PDF阅读器/Acrobat,而不是浏览器,例如,禁用Firefox中的Acrobat插件。
I can't be sure of my results, because I have two different Acrobat plugins that Firefox recognizes due to my having different versions of Adobe Acrobat and Adobe Reader, but it does appear that you at least need to test what happens if a website visitor has their browser set to not open the PDF in the browser. It could be quite annoying when they look at what appears to be an otherwise usable web page and their browser is nagging them to open a PDF file that they think they didn't request. In some cases, the PDF file spontaneously opened in Adobe Reader, not the browser, and in other cases the browser threw up a dialog saying the file didn't exist.
我不确定我的结果,因为我有两个不同的Acrobat Firefox插件,认识到由于我有不同版本的Adobe Acrobat阅读器,但它确实表明你至少需要测试如果一个网站访问者浏览器设置为没有在浏览器中打开PDF。当他们看到一个看似可用的网页,而他们的浏览器却在唠叨着要他们打开一个他们认为自己没有请求的PDF文件时,这可能会很烦人。在某些情况下,PDF文件是在adobereader而不是浏览器中自动打开的,在其他情况下,浏览器会弹出一个对话框,说该文件不存在。
I ran into such mismatches with iframe and object both, different issues for different code.
我遇到了与iframe和object都不匹配的问题,不同的代码有不同的问题。
This is for simple HTML code. I haven't tried the suggested frameworks.
这是简单的HTML代码。我还没有尝试建议的框架。
#7
0
pdf2htmlEX by coolwanglu is probably the best solution out there to convert a pdf file into html. You could do a simple convert and then embed the html page as an iframe or something similar.
coolwanglu的pdf2htmlEX可能是将pdf文件转换成html的最佳解决方案。您可以进行简单的转换,然后将html页面嵌入到iframe或类似的东西中。
#8
0
I would really opt for FlowPaper, especially their new Elements mode that can be found here : https://flowpaper.com/demo/
我真的会选择FlowPaper,尤其是它们的新元素模式,可以在这里找到:https://flowpaper.com/demo/
It flattens the PDFs significantly at the same time as keeping text sharp which means that it will load much faster on mobile devices
它在保持文本锐化的同时,使pdf文件变得更平滑,这意味着它在移动设备上的加载速度会更快。