Embed a PDF in HTML5

问题:

I am trying to embed a PDF in an HTML document, but this seems to work only with Chrome. Other browsers appear to either require plugins or require a user to click a link which is not what I want. Here is what I have tried:

<object data="pdfFiles/interfaces.pdf" type="application/pdf">
                <embed src=" pdfFiles/interfaces.pdf" type="application/pdf">&nbsp; </embed>
                    alt :<a href="pdfFiles/interfaces.pdf">
                </object>

回答1:

Here is the code you can use for every browser:

<embed src="pdfFiles/interfaces.pdf" width="600" height="500" alt="pdf" pluginspage="http://www.adobe.com/products/acrobat/readstep2.html">

Tested on firefox and chrome

回答2:

<iframe src="http://docs.google.com/gview?url=http://domain.com/pdf.pdf&embedded=true" 
style="width:600px; height:500px;" frameborder="0"></iframe>

Google docs allows you to embed PDFs, Microsoft Office Docs, and other applications by just linking to their services with an iframe. Its user-friendly, versatile, and attractive.

回答3:

This works perfectly and this is official html5.

<object data="http://www.inspuratesystems.com/clf/wp-content/uploads/2016/05/pdfjoiner.pdf"></object>

回答4:

do you know about http://mozilla.github.io/pdf.js/ it is a project by mozila to render pdf inside of your html using canvas. it is super simple to use.

回答5:

I recommend using PDFObject for PDF plugin detection.

This will only allow you to display alternate content if the user's browser isn't capable of displaying the PDF directly though. For example, the PDF will display fine in Chrome for most users, but they will need a plugin like Adobe Reader installed if they're using Firefox or Internet Explorer.

At least PDFObject will allow you to display a message with a link to download Adobe Reader and/or the PDF file itself if their browser doesn't already have a PDF plugin installed.

回答6:

FlexPaper is probably still the best viewer out there to be used for this kind of stuff. It has a traditional viewer and a more turn page / flip book style viewer both in flash and html5

http://flexpaper.devaldi.com