使用https://view.officeapps.live.com/op/view.aspx?src=文件路径预览文件而出现下图的效果:
1.文件路径需要编码:encodeURIComponent(文件链接)
2.文件路径不能包含ip,必须是域名,否则识别不到
3.链接必须是公网(外网)可以访问的,不能是内网IP,不能是局域网ip
4.链接必须包含文件类型,比如 http://www.a.com/zz/xx/文件名称.xlsx
5.还不能打开可以直接把文件路径在浏览器里打开,检查链接是否可以直接下载文件。
代码如下:
window.open(
'https://view.officeapps.live.com/op/view.aspx?src=' +
encodeURIComponent(url)
)
PS:
1.https://view.officeapps.live.com/op/view.aspx?src=文件路径 这个链接支持的文件为word,ppt,excel等,是不支持PDF和图片。
2.PDF文件的预览推荐使用 vue-pdf 插件