Jak osadzić przeglądarkę PDF na stronie?

Jeśli się nie mylę, Dokumenty Google oferują środki do wyświetlania pliku PDF, który jest przechowywany na tym samym serwerze co strona internetowa za pośrednictwem adresu internetowego <iframe>, ale muszę wiedzieć, jak mogę to zrobić w sposób zgodny z różnymi przeglądarkami.

Możesz rozważyć użycie PDFObject autorstwa Philipa Hutchisona.

Alternatywnie, jeśli szukasz rozwiązania nieobsługującego Javascript, możesz użyć takich znaczników:

<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>

PDF.js to eksperyment technologii HTML5, który bada tworzenie wiernego i wydajnego renderera Portable Document Format (PDF) bez pomocy natywnego kodu. Jest kierowany przez społeczność i wspierany przez Mozilla Labs.

Możesz zobaczyć demo tutaj .

To może działać trochę lepiej w ten sposób

<embed src= "MyHome.pdf" width= "500" height= "375">

Jeśli się nie mylę, OP pytał (chociaż później zaakceptował rozwiązanie .js), czy wbudowany serwer wyświetlania PDF Google będzie wyświetlał plik PDF na swojej własnej stronie internetowej.

A więc półtora roku później: tak, będzie.

Zobacz http://googlesystem.blogspot.ca/2009/09/embeddable-google-document-viewer.html . Zobacz też https://docs.google.com/viewer i wpisz adres URL pliku, który chcesz wyświetlić.

Edycja: ponownie czytając, OP prosił o rozwiązania, które nie używają ramek iFrame. Nie sądzę, żeby było to możliwe w przypadku przeglądarki Google.

spróbuj z Flex Paper http://flexpaper.devaldi.com/

działa jak scribd

Pamiętaj, aby przetestować dowolne rozwiązanie w różnych preferencjach Czytnika. Osoba odwiedzająca witrynę może ustawić przeglądarkę tak, aby otwierała plik PDF w programie Reader / Acrobat, a nie w przeglądarce, np. Wyłączając wtyczkę Acrobat w przeglądarce Firefox.

Nie jestem pewien moich wyników, ponieważ mam dwie różne wtyczki Acrobat, które Firefox rozpoznaje, ponieważ mam różne wersje Adobe Acrobat i Adobe Reader, ale wygląda na to, że przynajmniej musisz przetestować, co się stanie, jeśli odwiedzający witrynę ma ustawioną przeglądarkę tak, aby nie otwierała pliku PDF w przeglądarce. Może to być dość denerwujące, gdy patrzą na coś, co wygląda na stronę internetową, którą można w inny sposób wykorzystać, a ich przeglądarka nęka ich, aby otworzyli plik PDF, o którym myślą, że nie zażądali. W niektórych przypadkach plik PDF otwierał się spontanicznie w programie Adobe Reader, a nie w przeglądarce, aw innych przypadkach przeglądarka wyświetlała okno dialogowe z informacją, że plik nie istnieje.

Napotkałem takie niezgodności z elementami iframe i obiektem, różne problemy dla innego kodu.

To jest dla prostego kodu HTML. Nie próbowałem sugerowanych frameworków.

Naprawdę wybrałbym FlowPaper, zwłaszcza ich nowy tryb Elements, który można znaleźć tutaj: https://flowpaper.com/demo/

Znacznie spłaszcza pliki PDF, jednocześnie zachowując ostrość tekstu, co oznacza, że ​​będzie ładował się znacznie szybciej na urządzeniach mobilnych

używając bootstrap, możesz mieć responsywny i mobilny pierwszy osadzony plik.

<div class="embed-responsive embed-responsive-16by9">
  <iframe class="embed-responsive-item" src="address of your file" allowfullscreen></iframe>
</div>

Aspect ratios can be customized with modifier classes.
<!-- 21:9 aspect ratio -->
<div class="embed-responsive embed-responsive-21by9">
  <iframe class="embed-responsive-item" src="..."></iframe>
</div>

<!-- 16:9 aspect ratio -->
<div class="embed-responsive embed-responsive-16by9">
  <iframe class="embed-responsive-item" src="..."></iframe>
</div>

<!-- 4:3 aspect ratio -->
<div class="embed-responsive embed-responsive-4by3">
  <iframe class="embed-responsive-item" src="..."></iframe>
</div>

<!-- 1:1 aspect ratio -->
<div class="embed-responsive embed-responsive-1by1">
  <iframe class="embed-responsive-item" src="..."></iframe>
</div>

pdf2htmlEX firmy coolwanglu jest prawdopodobnie najlepszym dostępnym rozwiązaniem do konwersji pliku pdf na html. Możesz wykonać prostą konwersję, a następnie osadzić stronę html jako ramkę iframe lub coś podobnego.