0%

vue在线预览word的五种姿态

发表于 分类于 阅读次数： 阅读次数： Valine：
本文字数： 1.5k 阅读时长 ≈ 1 分钟

写在前面：

如本文描述有错误，希望读到这篇文章的您能够提出批评指正。 联系方式：172310978@qq.com

参考文章：

  1. https://blog.csdn.net/qq_31334119/article/details/125636392?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522168709750016800184193933%2522%252C%2522scm%2522%253A%252220140713.130102334.pc%255Fall.%2522%257D&request_id=168709750016800184193933&biz_id=0&utm_medium=distribute.pc_search_result.none-task-blog-2~all~first_rank_ecpm_v1~rank_v31_ecpm-5-125636392-null-null.142^v88^control_2,239^v2^insert_chatgpt&utm_term=vue%20word%E9%A2%84%E8%A7%88%E6%8F%92%E4%BB%B6&spm=1018.2226.3001.4187

方案一: docx-preview

通过vue的插件 docx-preview,可以完成docx的预览,需要后端配合,将文件流转换为blob流,前端运用插件内的方法,直接渲染docx流

  • 对应文档链接:
1
https://blog.csdn.net/weixin_54000091/article/details/124606368
  • git相似方案:
1
https://gitee.com/tomiaa/vue-preview-word-file-docx#http://tomiaa.gitee.io/vue-preview-word-file-docx/#/
  • 缺陷: 只支持docx,不支持doc
    但是我没用,为啥我没用呢?!不光是因为不支持doc…而是后端人员不太配合,说不会转bolb流… 卒

方案二: mammoth

  • 对应文档链接:
1
https://blog.csdn.net/qq_42697806/article/details/125423742
  • 缺陷: docx文档预览(只能转换.docx文档，转换过程中复杂样式被忽，居中、首行缩进等)

方案三:用docx云服务的在线预览,

但是后端提供的文件地址是要公开可访问的链接直接放弃

  • 对应文档链接:
1
https://blog.csdn.net/weixin_42190844/article/details/120869882

方案四: 直接用iframe 访问,当当当~~跨域…

.

方案五: 后端处理然后前端访问,后端将word转换成pdf,前端直接iframe读取

  1. 对应文档链接:
1
https://www.jb51.net/article/231444.htm

后端特殊注意一点 response.setHeader(“Content-Disposition”, “inline; filename=111.pdf”);

content-disposition 指示如何处理响应内容。
inline：直接在页面显示
attchment：以附件形式下载

在这里插入图片描述