前端实现在线预览office文件

前端实现在线预览office文件

1.直接通过调用微软的在线预览功能实现 (预览前提：资源必须是公共可访问的)

注意：该资源要是公共的，不能是ip地址，只能是域名，且资源地址透明，最好通过encodeURIComponent()方法修改地址。

//使用iframe嵌套
<iframe
src='https://view.officeapps.live.com/op/view.aspxsrc=资源地址'>
</iframe>
//使用js window.open方法
 window.open("https://view.officeapps.live.com/op/view.aspx?src=" + encodeURIComponent("资源地址"));

效果：

2.通过调用豆瓣在线预览方法
缺点：比较丑 但是没有其他没用的按钮

//使用iframe嵌套
<iframe
src='https://view.xdocin.com/xdoc?_xdoc==资源地址'>
</iframe>
//使用js window.open方法
 window.open("https://view.xdocin.com/xdoc?_xdoc==" + encodeURIComponent("资源地址"));

效果：

豆瓣在线预览对于excel很不友好 效果：