Как встроить PDF в HTML-страницу? - PullRequest
Новая
       21

Как встроить PDF в HTML-страницу?

0 голосов
/ 12 декабря 2018

Мне нужно встроить PDF-файл в HTML-страницу, чтобы пользователи могли просматривать его на всех основных устройствах. Большинство подходов отлично работают на настольных компьютерах, но они начинают показывать проблемы на устройствах iPad. Файлы PDF больше не прокручиваются, если они помещаются внутри тега iframe или embed.

Я использовал следующие приемыЧтобы преодолеть проблему:

1) Использование pdf-image для узла и преобразование PDF в изображения, а затем их скольжение в делении.Проблема в этом подходе состоит в том, что качество изображения ухудшается и не подходит для просмотра в Интернете.

2) Использование PDF.js от Mozilla. Это прекрасно работает на любом устройстве, но оно делает страницу крайне медленной и не отвечает на iPad

3) Использование Google PDF viewer 

<iframe src="https://docs.google.com/viewer?url=http://public-Url-of-pdf.pdf&embedded=true" frameborder="0" height="500px" width="100%"></iframe>

Проблема в этом подходе заключается в том, что мне нужноPDF-файлы, общедоступные , которые я не хочу делать по соображениям безопасности.

Ни один из описанных выше способов не работает для меня.Есть ли какое-либо решение для встраивания PDF в страницу, которая также работает на iPad.

Один из моих коллег рассказал мне об использовании LibreOffice (открытый офис) без головы для встраивания PDF-файлов в мою страницу, ноЯ не могу найти документацию по использованию?

Может кто-нибудь помочь?:(

Заранее спасибо!

Ответы [ 2 ]

0 голосов
/ 12 декабря 2018 
<embed src="http://example.com/the.pdf" width="500" height="375" />

Попробуйте выше одного для чистого HTML.Но другой вариант, если вы хотите использовать с javascript, попробуйте Pdf.js на mozilla.https://github.com/mozilla/pdf.js

0 голосов
/ 12 декабря 2018

Я думаю, что самый простой способ встроить PDF в веб-страницу - это использовать тег объекта: 

<object data="assets/test.pdf" type="application/pdf" width="100%" height="800px">
 <p>It appears you don't have a PDF plugin for this browser.
 No biggie... you can <a href="assets/test.pdf">click here to
  download the PDF file.</a></p>
</object>

Что будет делать код выше: - Если пользователь, просматривающий ваш сайт, имеет PDFПлагин Viewer (который по умолчанию включен в некоторых браузерах) откроет PDF в браузере: - Если у пользователя нет плагина PDF Viewer, ему будет предоставлена ​​ссылка для загрузки PDF и просмотра его на своем сайте.,

...