Como posso inserir um visualizador de PDF em uma página web?

Se não me engano, o Google Docs oferece os meios para mostrar um PDF que é armazenado no mesmo servidor que a página web através de um iFrame, mas preciso de saber como posso fazer isto de forma compatível com o navegador cruzado.

 69
Author: Jon, 2012-12-29

8 answers

Podias considerar usar PDFObject por Philip Hutchison.

Em alternativa, se estiver à procura de uma solução não Javascript, pode usar uma marcação como esta:

<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>
 150
Author: Ian Gregory, 2015-04-20 19:32:48

PDF.js é um experimento de tecnologia HTML5 que explora a construção de um renderizador de formato de Documento Portátil (PDF) fiel e eficiente sem a ajuda de código nativo. É guiado pela comunidade e apoiado pela Mozilla Labs.

Você pode ver a demonstração aqui .

 22
Author: mutil, 2017-08-30 01:32:47
Isto pode funcionar um pouco melhor assim.
<embed src= "MyHome.pdf" width= "500" height= "375">
 11
Author: DoesEatOats, 2017-11-08 10:50:40

Se não estou enganado, a operação estava a perguntar (embora mais tarde aceite A.js solution) se o servidor de exibição de PDF embutido do Google irá exibir um PDF em seu próprio site.

Então, um ano e meio depois, sim, vai.

Ver http://googlesystem.blogspot.ca/2009/09/embeddable-google-document-viewer.html Veja também https://docs.google.com/viewer , e ligue o URL do ficheiro que deseja mostrar.

Editar: reler, o OP estava a pedir soluções que não usam iFrames. Acho que isso não é possível com o visualizador do Google.

 9
Author: Jon, 2015-07-11 13:13:49

Tenta com papel flexível. http://flexpaper.devaldi.com/

Funciona como scribd

 4
Author: Mp de la Vega, 2012-12-29 11:19:11

Certifique-se de testar qualquer solução através de diferentes preferências de leitor. Um visitante do site pode ter seu navegador definido para abrir o PDF no Reader / Acrobat, em oposição ao navegador, por exemplo, desativando o plugin Acrobat no Firefox..

Não posso ter a certeza dos meus resultados, porque tenho dois plugins Acrobat diferentes que o Firefox reconhece devido ao facto de ter versões diferentes do Adobe Acrobat e do Adobe Reader, mas parece que pelo menos precisas de testar o que acontece se um website o visitante tem seu navegador definido para não abrir o PDF no navegador. Pode ser bastante irritante quando eles olham para o que parece ser uma página web de outra forma utilizável e seu navegador está incomodando-os a abrir um arquivo PDF que eles acham que não pediram. Em alguns casos, o arquivo PDF abriu espontaneamente no Adobe Reader, não no navegador, e em outros casos o navegador lançou uma janela dizendo que o arquivo não existia.

Encontrei tantas discrepâncias com o iframe e com o objecto, questões diferentes. para código diferente.

Isto é para código HTML simples. Ainda não experimentei as estruturas sugeridas.

 3
Author: Charles Belov, 2014-01-11 00:18:48

Pdf2htmlEX by coolwanglu é provavelmente a melhor solução para converter um arquivo pdf em html. Você poderia fazer um simples convert e, em seguida, incorporar a página html como um iframe ou algo semelhante.

 0
Author: Dreizeiler, 2016-02-02 15:23:12
Eu realmente optaria pelo Fluxaper, especialmente o modo de novos elementos que podem ser encontrados aqui : https://flowpaper.com/demo/

Nivela significativamente a PDFs ao mesmo tempo que mantém o texto afiado, o que significa que irá carregar muito mais depressa em dispositivos móveis

 0
Author: Robby, 2016-08-16 17:46:48