秋天的景色真美丽，像一幅美丽的图画。
正文
我们在浏览器阅读word，excel，pptx的offic文件，可以使用微软的开发接口，一个阅读器Office Web
什么是 Office Web 查看器？
它是一种创建 Office Web Viewer 链接的服务。Office Web Viewer 链接可在浏览器中打开 Word、PowerPoint 或 Excel 文件，否则这些文件将被下载。您可以轻松地将下载链接转换为 Office Web Viewer 链接以在您的网站或博客中使用（例如，食谱、照片幻灯片、菜单或预算模板）。
Office Web Viewer 的一些优点包括：
- 您无需为 Web 转换 Office 文件（例如，PDF、HTML）。
- 任何人都可以从您的网站或博客查看 Office 文件，即使他们没有 Office。
- 它会密切关注您的网站或博客，因为读者无需下载文件，他们就可以留在浏览器中。
- 一个链接适用于计算机、平板电脑和手机。
vue预览word，excel，pptx，pdf文件
1、做word，excel，pptx的预览，要先确定文件路径访问是通过域名的url来预览，不可以通过IP的url来访问
先把文件路径的url进行url编码（encodeURIComponent）
let router = 'https://aaaaaa.com/file/download?filename=file.obj_id' //文件路径 let url = encodeURIComponent(routeUrl)
然后用Office Web Viewer的路径接口
http://view.officeapps.live.com/op/view.aspx?src=
把两个拼接在一起
let officeUrl = 'http://view.officeapps.live.com/op/view.aspx?src='+url window.open(officeUrl,'_target')
这样就可以预览word，excel，pptx文件了
完整的代码
let routeUrl = 'https://aaaaaa.com/file/download?filename=file.obj_id' let url = encodeURIComponent(routeUrl) let officeUrl = 'http://view.officeapps.live.com/op/view.aspx?src='+url window.open(officeUrl,'_target')
2、pdf文件预览
下载好pdf.js(下载地址在下面)，放到static的目录下面
网站链接http://mozilla.github.io/pdf.js/getting_started/#download
然后
<div style="height:800px;"> <iframe :src="pdfSrc" width="100%" height="100%"></iframe> </div>
getSeePdf(file){
this.pdffile=file
let routeUrl = '文件地址url';
let pSrc = routeUrl + '?r=' + new Date();
this.pdfSrc = 'static/pdf/web/viewer.html?file=' + encodeURIComponent(pSrc) + '.pdf';
},
更多的可以了解下微软的这个查看器的官网
以上就是vue使用Office Web实现线上文件预览的详细内容，更多关于vue Office Web文件预览的资料请关注其它相关文章！
