web-dev-qa-db-ja.com

Webブラウザー内でPDFを表示します

.htmlページのWebブラウザ内でPDFを表示するにはどうすればよいですか？

htmlpdfbrowser
73
CodeGuy

Googleドキュメントの埋め込みPDFビューアーを使用しています。ドキュメントをGoogleドキュメントにアップロードする必要はありませんが、オンラインで利用できる必要があります。

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

iframeを使用する代わりにthird partyに応じて、flexpaperまたはpdf.jsの使用を検討してください。

pdf.js を使用しましたが、私にとっては問題ありません。

ここにデモがあります： http://mozilla.github.com/pdf.js/web/viewer.html

32
navins

最も簡単な方法は、 iframe を作成し、ソースをPDFのURLに設定することです。

（気違いのHTMLデザイナーにダック）自分でやった、うまく機能し、クロスブラウザー（バンカーにクロール）。

18
Will

オブジェクトタグを使用して優先

<object data='http://website.com/nameoffolder/documentname.pdf#toolbar=1' 
        type='application/pdf' 
        width='100%' 
        height='700px'>

幅と高さは任意の値に変更できることに注意してください http://www.w3schools.com/tags/tag_object.asp

12
BAKARI SHEGHEMBE

ブラウザのプラグインはこれらの設定を制御するため、強制することはできません。ただし、<a href="whatver.pdf">の代わりに単純な<a href="whatever.pdf" target="_blank">を実行できます。

6
jschorr

PDFObject のようなサードパーティのソリューションを通じてJavaScriptを使用して埋め込むこともできます。

3
Nils Magne Lunde

PDFをホストしている限り、ターゲット属性を使用できます。言い換えると、相対ファイルの場合、_blank値でtarget属性を使用しても問題なく機能します。

<e>
  <a target="_blank" alt="StackExchange Handbook" title="StackExchange Handbook"
     href="pdfs/StackExchange_Handbook.pdf">StackExchange Handbook</a>

絶対パスの場合、エンジンはU nified R esource L ocatorに移動して開きます。したがって、ターゲット属性を抑制します。

<e>
  <a alt="StackExchange Handbook" title="StackExchange Handbook"
     href="protocol://url/StackExchange_Handbook.pdf">StackExchange Handbook</a>

どちらの場合も、ブラウザーは信頼できる良い仕事をします。

3
ftcosta

次のコードを使用できます。

<embed src="http://domain.com/your_pdf.pdf" width="600" height="500" alt="pdf" pluginspage="http://www.Adobe.com/products/acrobat/readstep2.html">

または、Googleドキュメントの埋め込み可能なPDFビューアーを使用します。

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

この単純なGoogleDocアプローチも使用できます。

<a  style="color: green;" href="http://docs.google.com/gview?url=http://domain//docs/<?php echo $row['docname'] ;?>" target="_blank">View</a>

これにより、フローを歪めることなくドキュメントを表示するための新しいページが作成されます。

1
Asuquo12

簡単な解決策は、それをiframeに入れ、ユーザーがそれをサポートするプラグインを持っていることを期待することです。

（私はしません、Acrobatプラグインはリソースを大量に消費し、不安定なソースでしたので、触れたブラウザーから削除するように指示しました）。

複雑ではあるが比較的一般的なソリューションは、フラッシュアプ​​レットで表示することです。

0
Quentin

PDFファイルページを JPedal （Javaライブラリ）を使用して、サーバー上のPNGファイルとしてレンダリングします。それをいくつかのjavascriptと組み合わせることで、視覚化とナビゲーションを高度に制御できます。

0
Carles Barrobés