Как отобразить документ Word (.доктор.,docx) в браузере с использованием JavaScript?

Я успешно сделал код для отображения PDF-файла в браузере вместо диалогового окна" открыть/сохранить". Теперь я застрял, пытаясь отобразить документ Word в браузере. Я хочу отобразить документ Word в Firefox, IE7+, Chrome и т. д.

может ли кто-нибудь помочь? Я всегда получаю диалоговое окно "открыть/сохранить" при отображении слова doc в браузере. Я хочу реализовать эту функциональность с помощью JavaScript.

6 ответов


в настоящее время в браузерах нет кода, необходимого для рендеринга документов Word, и, насколько мне известно, нет библиотек на стороне клиента, которые в настоящее время существуют для их рендеринга.

однако, если вам нужно только отобразить документ Word, но не нужно его редактировать, вы можете использовать Google Documents' Viewer через <iframe> для отображения удаленно .doc/.docx.

<iframe src="http://docs.google.com/gview?url=http://remote.url.tld/path/to/document.doc&embedded=true"></iframe>

решение адаптировано из "как отобразить документ word с помощью fancybox".

пример:

JSFiddle

однако, если вы предпочитаете иметь встроенную поддержку, в большинстве, если не во всех браузерах, я бы рекомендовал resaving .doc/.docx в качестве PDF-файла они также могут быть независимо визуализированы с помощью в формате PDF.js Mozilla.

Edit:

огромное спасибо fatbotdesigns для публикации средства просмотра Microsoft Office 365 в комментарии.

<iframe src='https://view.officeapps.live.com/op/embed.aspx?src=http://remote.url.tld/path/to/document.doc' width='1366px' height='623px' frameborder='0'>This is an embedded <a target='_blank' href='http://office.com'>Microsoft Office</a> document, powered by <a target='_blank' href='http://office.com/webapps'>Office Online</a>.</iframe>

еще один важный нюанс, как указал lightswitch05, это будет загружать ваш документ на сторонний сервер. Если это неприемлемо, то этот метод отображения не является правильным курсом действий.

Живые Примеры:

Google Docs Viewer

Microsoft Office Viewer


ответы Брэндона и fatbotdesigns оба правильны, но реализовав предварительный просмотр документов Google, мы нашли несколько .docx файлы, которые не могут быть обработаны Google. Переключился на MS Office онлайн превью и работает как шарм.

моей рекомендацией было бы использовать URL-адрес MS Office Preview поверх Google.

https://view.officeapps.live.com/op/embed.aspx?src=http://remote.url.tld/path/to/document.doc' 

кажется, есть некоторые библиотеки js, которые могут обрабатывать .docx (нет .doc) для конвертации html на стороне клиента (в определенном порядке):

Примечание: Если вы ищете лучший способ конвертировать файл doc/docx на стороне клиента, то, вероятно, ответ не надо. Если тебе действительно нужно это сделать, сделай это. на стороне сервера, то есть с libreoffice в безголовом режиме, apache-poi или любой другой библиотекой, лучше всего подходит для вас.


ViewerJS полезно для просмотра / встраивания формата openoffice, такого как odt,odp,ods, а также pdf.

для встраивания openoffice / pdf документа

<iframe src = "/ViewerJS/#../demo/ohm2013.odp" width='700' height='550' allowfullscreen webkitallowfullscreen></iframe>

/ViewerJS/ - это путь ViewerJS

#../demo/ohm2013 - путь ваш файл хотите добавьте


Кажется, у меня есть идея. Это тоже делает мою гайку, и у меня все еще возникают проблемы с ее отображением в Chrome.

сохранить документ(наименование.docx) в word как веб-страница с одним файлом (имя.mht) В вашем html используйте

<iframe src= "name.mht" width="100%" height="800"> </iframe>

изменить высоту и ширину, как вы считаете нужным.


Если вы хотите предварительно обработать ваши файлы DOCX, а не ждать, пока среда выполнения вы можете преобразовать их в HTML сначала с помощью API преобразования файлов, таких как Zamzar. Вы можете использовать API для программного преобразования из DOCX в HMTL, сохранения вывода на сервер, а затем обслуживать этот HTML до конечных пользователей.

преобразование довольно легко:

curl https://api.zamzar.com/v1/jobs \
-u API_KEY: \
-X POST \
-F "source_file=@my.docx" \
-F "target_format=html5"

это удалит любые зависимости времени выполнения от служб Google и Microsoft (например если они были, или вы были ограничены их).

Он также имеет преимущество, которое вы можете расширить до иные типы файлов Если вы хотели (PPTX, XLS, DOC и т. д.)