Bagaimana cara menyematkan penampil PDF di halaman?

Jika saya tidak salah, Google Docs menawarkan cara untuk menampilkan PDF yang disimpan di server yang sama dengan halaman web melalui <iframe>, tapi saya perlu tahu bagaimana saya bisa melakukan ini dengan cara yang sesuai lintas-browser.

Anda dapat mempertimbangkan untuk menggunakan PDFObject oleh Philip Hutchison.

Atau, jika Anda mencari solusi non-Javascript, Anda dapat menggunakan markup seperti ini:

<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 adalah eksperimen teknologi HTML5 yang mengeksplorasi pembuatan perender Portable Document Format (PDF) yang setia dan efisien tanpa bantuan kode asli. Ini digerakkan oleh komunitas dan didukung oleh Mozilla Labs.

Anda bisa melihat demonya di sini .

Ini mungkin bekerja sedikit lebih baik dengan cara ini

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

Jika saya tidak salah, OP bertanya (meskipun kemudian menerima solusi .js) apakah server tampilan PDF tertanam Google akan menampilkan PDF di situs webnya sendiri.

Jadi, satu setengah tahun kemudian: ya, itu akan terjadi.

Lihat http://googlesystem.blogspot.ca/2009/09/embeddable-google-document-viewer.html . Juga, lihat https://docs.google.com/viewer , dan masukkan URL file yang ingin Anda tampilkan.

Sunting: Membaca ulang, OP meminta solusi yang tidak menggunakan iFrames. Saya tidak berpikir itu mungkin dengan penampil Google.

coba Flex Paper http://flexpaper.devaldi.com/

itu bekerja seperti scribd

Pastikan untuk menguji solusi apa pun di berbagai preferensi Pembaca. Pengunjung situs mungkin mengatur browser mereka untuk membuka PDF di Reader / Acrobat sebagai kebalikan dari browser, misalnya, dengan menonaktifkan plugin Acrobat di Firefox ..

Saya tidak dapat memastikan hasil saya, karena saya memiliki dua plugin Acrobat berbeda yang dikenali Firefox karena versi Adobe Acrobat dan Adobe Reader saya berbeda, tetapi tampaknya Anda setidaknya perlu menguji apa yang terjadi jika pengunjung situs web telah menyetel browser mereka untuk tidak membuka PDF di browser. Ini bisa sangat mengganggu ketika mereka melihat apa yang tampak sebagai halaman web yang bisa digunakan dan browser mereka mengganggu mereka untuk membuka file PDF yang menurut mereka tidak mereka minta. Dalam beberapa kasus, file PDF secara spontan dibuka di Adobe Reader, bukan di browser, dan dalam kasus lain browser memunculkan dialog yang mengatakan file tersebut tidak ada.

Saya mengalami ketidakcocokan dengan iframe dan objek keduanya, masalah berbeda untuk kode berbeda.

Ini untuk kode HTML sederhana. Saya belum mencoba kerangka kerja yang disarankan.

Saya benar-benar akan memilih FlowPaper, terutama mode Elemen baru mereka yang dapat ditemukan di sini: https://flowpaper.com/demo/

Ini meratakan PDF secara signifikan pada saat yang sama dengan menjaga teks tetap tajam yang berarti akan memuat lebih cepat di perangkat seluler

menggunakan bootstrap Anda dapat memiliki file sematan pertama yang responsif dan seluler.

<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 oleh coolwanglu mungkin merupakan solusi terbaik untuk mengonversi file pdf menjadi html. Anda dapat melakukan konversi sederhana dan kemudian menyematkan halaman html sebagai iframe atau yang serupa.