Làm cách nào để hiển thị tài liệu Word (.doc, .docx) trong trình duyệt bằng JavaScript?

Tôi đã thực hiện thành công mã để hiển thị tệp PDF trong trình duyệt thay vì hộp thoại "Mở / Lưu". Bây giờ, tôi bị kẹt khi cố gắng hiển thị một tài liệu Word trong trình duyệt. Tôi muốn hiển thị một tài liệu Word trong Firefox, IE7 +, Chrome, v.v.

Có ai giúp được không? Tôi luôn nhận được hộp thoại "Mở / Lưu" trong khi hiển thị tài liệu Word trong trình duyệt. Tôi muốn thực hiện chức năng này bằng JavaScript.

Hiện tại không có trình duyệt nào có mã cần thiết để hiển thị Tài liệu Word và theo như tôi biết, không có thư viện phía máy khách nào hiện đang tồn tại để hiển thị chúng.

Tuy nhiên, nếu bạn chỉ cần hiển thị Tài liệu Word, nhưng không cần chỉnh sửa nó, bạn có thể sử dụng Trình xem tài liệu của Google thông qua một <iframe>để hiển thị lưu trữ từ xa .doc/ .docx.

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

Giải pháp được điều chỉnh từ " Cách hiển thị tài liệu từ bằng Fancybox ".

Thí dụ:

Câu đố

Tuy nhiên, nếu bạn muốn có hỗ trợ riêng, trong hầu hết, nếu không phải tất cả các trình duyệt, tôi khuyên bạn nên lưu lại .doc/ .docxdưới dạng tệp PDF. Chúng cũng có thể được kết xuất độc lập bằng PDF.js của Mozilla.

Biên tập:

Rất cảm ơn fatbotdesigns đã đăng trình xem Microsoft Office 365 trong các bình luận.

<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>

Một lưu ý quan trọng hơn cần ghi nhớ, như được chỉ ra bởi lightwitch05 , là điều này sẽ tải tài liệu của bạn lên máy chủ của bên thứ ba. Nếu điều này là không thể chấp nhận, thì phương pháp hiển thị này không phải là quá trình hành động thích hợp.

Ví dụ trực tiếp:

Trình xem Google Docs

Trình xem Microsoft Office

Các câu trả lời của Brandon và fatbotdesign đều đúng, nhưng khi triển khai bản xem trước tài liệu Google, chúng tôi đã tìm thấy nhiều tệp .docx không thể xử lý bởi Google. Chuyển sang xem trước MS Office Online và các tác phẩm thích một sự quyến rũ.

Đề xuất của tôi sẽ là sử dụng URL Xem trước MS Office trên Google.

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

Dường như có một số thư viện js có thể xử lý .docx (không phải .doc) sang phía máy khách chuyển đổi html (không theo thứ tự cụ thể):

• https://github.com/lalalic/docx2html - docx sang html, hầu hết các yếu tố đều được hỗ trợ

• https://github.com/mwilliamson/mammoth.js - hỗ trợ các tiêu đề, danh sách, bảng, chú thích, chú thích, hình ảnh và hộp văn bản

• https://www.npmjs.com/package/docx2html - Chuyển đổi tài liệu DOCX thành HTML trong trình duyệt hoặc nodejs

• https://github.com/artburkart/docx2html - rõ ràng, hoạt động trong trình duyệt

^{Lưu ý: Nếu bạn đang tìm kiếm cách tốt nhất để chuyển đổi tệp doc / docx ở phía máy khách, thì có lẽ câu trả lời là không làm điều đó . Nếu bạn thực sự cần phải làm điều đó thì hãy thực hiện phía máy chủ, tức là với libreoffice ở chế độ không đầu , apache-poi (java) , pandoc hoặc bất kỳ thư viện nào khác phù hợp nhất với bạn.}

Tôi nghĩ rằng tôi có một ý tưởng. Điều này cũng đã được thực hiện và tôi vẫn gặp khó khăn khi hiển thị nó trong Chrome.

Lưu tài liệu (name.docx) trong word dưới dạng trang web tệp đơn (name.mht) Trong sử dụng html của bạn

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

Thay đổi chiều cao và chiều rộng khi bạn thấy phù hợp.

ViewerJS rất hữu ích để xem / nhúng định dạng openoffice như odt, odp, ods và cả pdf.

Đối với tài liệu pdf / openoffice nhúng

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

/ViewerJS/ là đường dẫn của ViewerJS

#../demo/ohm2013 là đường dẫn tệp của bạn muốn nhúng

Tài liệu gốc (trong đó tôi có sở thích) làm cho người xem (và biên tập viên) đặc biệt dành cho tài liệu Word (cả định dạng nhị phân .doc và định dạng docx hiện đại). Nó làm như vậy mà không mất chuyển đổi sang HTML. Dưới đây là cách bắt đầu https://github.com/NativeDocument/nd-WordFileEditor/blob/master/README.md

Nếu bạn muốn xử lý trước các tệp DOCX của mình, thay vì đợi đến khi chạy, trước tiên bạn có thể chuyển đổi chúng thành HTML bằng cách sử dụng API chuyển đổi tệp như Zamzar . Bạn có thể sử dụng API để chuyển đổi theo chương trình từ DOCX sang HMTL, lưu đầu ra vào máy chủ của bạn và sau đó phân phát HTML đó cho người dùng cuối của bạn.

Chuyển đổi khá dễ dàng:

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

Điều này sẽ loại bỏ mọi phụ thuộc thời gian chạy trên các dịch vụ của Google và Microsoft (ví dụ: nếu chúng bị hỏng hoặc bạn bị giới hạn bởi tốc độ của chúng).

Nó cũng có lợi ích là bạn có thể mở rộng sang các loại tệp khác nếu bạn muốn (PPTX, XLS, DOC, v.v.)