前端vue3实现本地及在线文件预览(含pdf/txt/mp3/mp4/docx/xlsx/pptx) | 您所在的位置:网站首页 › 怎样预览ppt效果 › 前端vue3实现本地及在线文件预览(含pdf/txt/mp3/mp4/docx/xlsx/pptx) |
一、仅需实现在线预览,且文件地址公网可访问
(一)微软office免费预览(推荐)
支持doc/docx/xls/xlsx/ppt/pptx等多种office文件格式的免费预览 //示例代码 //在https://view.officeapps.live.com/op/view.aspx?src=后面拼接需要预览的地址,如下:\ let url="http://xxx.com/files/demo.doc" window.open("https://view.officeapps.live.com/op/view.aspx?src="+encodeURIComponent(url)) (二)XDOC文档预览云服务移动端和PC端无插件预览PDF、OFD、Word、WPS等多种格式文档 //示例 let url="http://xxx.com/files/demo.doc" window.open("https://view.xdocin.com/view?src=" + encodeURIComponent(url)) 二、本地及非公网文件在线预览本地或内网预览需要借助插件实现,pdf、mp3、mp4等主要靠原生标签或浏览器自带功能,尽量减少了插件的安装 (一)pdf、txt直接使用ifrem嵌入页面,用浏览器自带预览功能满足基本需求,其他也可以试试vue-office的pdf插件 pdf预览效果 txt预览效果 (二)mp3、mp4使用原生audio和video标签能满足基本需求,如有其他功能的需要可以使用video.js等插件 mp3预览效果 |
CopyRight 2018-2019 实验室设备网 版权所有 |