How to embed a PDF in HTML page?

Question

We would like to show the PDF document in an HTML page after retrieving it from the database via a servlet's doGet method.

Can anyone share some snippets on how to achieve this?

"Show" how? Using a browser plug-in that is installed on the user's system? — Pekka, Apr 06 '11 at 11:45
You just need to return the appropriate mimetype in the response header. — symcbean, Apr 06 '11 at 11:57
You will need to use the object, embed or iframe tag to do a separate http request for the content — mplungjan, Apr 06 '11 at 11:59
@symcbean - I am returning an appropriate mimetype for this doc as part of the http response — user339108, Apr 06 '11 at 12:03

score 22 · Accepted Answer · edited May 23 '17 at 12:26

22

Non-html content apart from images needs to be retrieved using an object, embed or iframe tag

iframe: <iframe src="somepage.pdf"></iframe>
object/embed: <object src="somepage.pdf"><embed src="somepage.pdf"></embed></object>

somepage.pdf could be somepage.jsp?filename=somepage&mimetype=application/pdf

Here is an interesting link How to Embed Microsoft Office or PDF Documents in Web Pages

and here is a stackoverflow search

edited May 23 '17 at 12:26

Community

1
1

answered Apr 06 '11 at 12:10

mplungjan

134,906
25
152
209

1

I need to use inline style elements from the parent document in the child document. Iframe doesn’t allow this. Would this work with embed or object? – user2284570 Aug 25 '15 at 23:31
Unlikely. If cross domain it will also not work. If not, then iframe should work. Ask a separate question – mplungjan Aug 26 '15 at 03:44
same domain. But the question is already asked and it's answers only provide response for using external stylesheets. – user2284570 Aug 26 '15 at 08:53
So why can't you use iFrame? You can copy and insert the parent's stylesheets into the iframe when loading – mplungjan Aug 26 '15 at 09:02
In fact I don't need an iframe. This is for a single tag which is pre. The content require a special editor that I wrote myself and it's very difficult to edit it. So I thought the best was to split that part for the main document. Also the solution should not require visitors to enable JavaScript. – user2284570 Aug 26 '15 at 09:12
2

When i'm trying these, it's start downloading the docx file, is it because i'm not on a server (offline), or im' missing something? – Mousa Alfhaily Apr 06 '17 at 08:45
Likely your browser is not set up to use word embedded. – mplungjan Apr 06 '17 at 08:50
This will work only for PDF, for any Microsoft Office format it will download the file. I even tested it on Edge, and still I didn't managed to View a .docx file. Did anyone managed to make this work?? – Gil Epshtain Dec 24 '19 at 16:55

score 10 · Answer 2 · edited Jul 19 '16 at 07:02

10

Google docs viewer can handle this.

try

<html>
    <head>
        <style>
            *{margin:0;padding:0}
            html, body {height:100%;width:100%;overflow:hidden}
        </style>
        <meta charset="utf-8">
            <?php
                 $url = $_GET['url'];
             ?>
        <title><?php echo $url; ?></title>
    </head>
    <body>
        <iframe src="http://docs.google.com/viewer?url=<?=urlencode($url)?>&embedded=true"  style="position: absolute;width:100%; height: 100%;border: none;"></iframe>
    </body>
</html>

edited Jul 19 '16 at 07:02

Breeze

1,824
2
30
37

answered Feb 03 '16 at 12:32

lonestar

347
1
5
13

Thanks, this is the only way that i found and working. – Mousa Alfhaily Apr 11 '17 at 12:58

score 0 · Answer 3 · answered May 08 '14 at 21:41

0

If you are looking for a pure HTML version of the document (for fast rendering and cross browser support), you can go through Docspad. Docspad helps embedding all the different popular document formats into your web application. http://docspad.com

answered May 08 '14 at 21:41

Ajay Narang

308
2
9

5

Docspad is dead: "We will no longer support Docspad services effective October 19, 2014" – Jeromy French May 20 '15 at 21:38

How to embed a PDF in HTML page?

3 Answers3

Linked

Related