Если я не ошибаюсь, Google Docs предлагает средства для отображения PDF-файла, который хранится на том же сервере, что и веб-страница, через файл <iframe>, но мне нужно знать, как я могу сделать это кроссбраузерным способом.
Если я не ошибаюсь, Google Docs предлагает средства для отображения PDF-файла, который хранится на том же сервере, что и веб-страница, через файл <iframe>, но мне нужно знать, как я могу сделать это кроссбраузерным способом.
Ответы:
Вы можете рассмотреть возможность использования PDFObject Филипа Хатчисона.
В качестве альтернативы, если вы ищете решение, отличное от Javascript, вы можете использовать такую разметку:
<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>
Это могло бы работать немного лучше таким образом
<embed src= "MyHome.pdf" width= "500" height= "375">
type="application/pdf".
Если я не ошибаюсь, OP спрашивал (хотя позже принял решение .js), будет ли встроенный сервер отображения PDF-файлов Google отображать PDF-файл на его собственном веб-сайте.
Итак, полтора года спустя: да, будет.
См. Http://googlesystem.blogspot.ca/2009/09/embeddable-google-document-viewer.html . Также см. Https://docs.google.com/viewer и вставьте URL-адрес файла, который вы хотите отобразить.
Изменить: перечитывая, OP просил решения, которые не используют iFrames. Я не думаю, что это возможно с программой просмотра Google.
попробуйте Flex Paper http://flexpaper.devaldi.com/
это работает как scribd
Обязательно протестируйте любое решение в различных предпочтениях Reader. Посетитель сайта может настроить свой браузер для открытия PDF-файла в Reader / Acrobat, а не в браузере, например, отключив плагин Acrobat в Firefox.
Я не могу быть уверен в своих результатах, потому что у меня есть два разных плагина Acrobat, которые Firefox распознает из-за того, что у меня разные версии Adobe Acrobat и Adobe Reader, но похоже, что вам, по крайней мере, нужно проверить, что произойдет, если посетитель веб-сайта в браузере установлен запрет на открытие PDF-файла в браузере. Это может сильно раздражать, когда они смотрят на то, что кажется вполне пригодной для использования веб-страницей, и их браузер требует от них открыть файл PDF, который, по их мнению, они не запрашивали. В некоторых случаях файл PDF самопроизвольно открывался в Adobe Reader, а не в браузере, а в других случаях браузер отображал диалоговое окно, в котором говорилось, что файл не существует.
Я столкнулся с такими несоответствиями с iframe и object, разные проблемы для разного кода.
Это для простого HTML-кода. Я не пробовал предлагаемые фреймворки.
Я бы действительно выбрал FlowPaper, особенно их новый режим Elements, который можно найти здесь: https://flowpaper.com/demo/
Он значительно сглаживает PDF-файлы, в то же время сохраняя четкость текста, что означает, что он будет загружаться намного быстрее на мобильных устройствах.
используя bootstrap, вы можете получить адаптивный и мобильный файл, который сначала внедряется.
<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 от coolwanglu, вероятно, лучшее решение для преобразования pdf-файла в html. Вы можете выполнить простое преобразование, а затем встроить html-страницу как iframe или что-то подобное.