项目场景:后台管理项目中需要展示world、excel等文件
问题描述
前端预览office插件大多数都是收费的,比如:
XDOC文档预览云服务(有试用期)
需要一个免费的且兼容各种文件格式的方法
解决方案:
使用微软在线的api,实现全部的office文件预览
前提是需要后端提供文本在线的链接且必须是域名链接 必须是域名链接
'https://view.officeapps.live/op/embed.aspx?src='+ url(文档在线连接)
<el-dialog title="预览" :visible.sync="open1" width="1000px" height="800px" append-to-body>
<iframe width="900px" height="600px"
:src='url1'>
</iframe>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="downloadField">下载</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
look(url){
//需要判断一下是office文件还是pdf pdf不用加微软的api
let str = url.substring(url.lastIndexOf(".")+1)
if(str == 'pdf'){
this.url1 = url
this.open1=true;
this.fileUrl = url
}else{
this.url1 = 'https://view.officeapps.live/op/embed.aspx?src='+url
this.open1=true;
this.fileUrl = url
}
},
更多推荐
office文件在线预览
发布评论