前端实现在线预览文件

一、实现word、xls、ppt文件的在线预览功能

1、通过调用微软的在线预览功能,

word、ppt、xls文件实现在线预览的方式比较简单可以直接通过调用微软的在线预览功能实现(预览前提:资源必须是公共可访问的)

javascript 复制代码
<iframe src='https://view.officeapps.live.com/op/view.aspx?src=http://storage.xuetangx.com/public_assets/xuetangx/PDF/1.xls' width='100%' height='100%' frameborder='1'></iframe>

2、XDOC实现 word、xls、ppt文件在线预览功能

XDOC可以实现预览以DataURI表示的DOC文档,此外XDOC还可以实现文本、带参数文本、html文本、json文本、公文等在线预览,具体实现方法请看官方文档

下面这种方式,可以实现快速浏览文件,但是对文件使用的编辑器可能会有一些限制:

javascript 复制代码
<a href="http://www.xdocin.com/xdoc?_func=to&amp;_format=html&amp;_cache=1&amp;_xdoc=http://www.xdocin.com/demo/demo.docx" target="_blank" rel="nofollow">XDOC</a>
相关推荐
霸王蟹7 天前
Vue3中keep-alive缓存组件应用场景。
前端·vue.js·缓存·typescript·js·htnl
maybe02099 天前
前端表格数据导出Excel文件方法,列自适应宽度、增加合计、自定义文件名称
前端·javascript·excel·js·大前端
PagiHi9 天前
好消息!软航文档控件(NTKO WebOffice)在Chrome 133版本上提示扩展已停用的解决方案
前端·chrome·中间件·js·activex
码农研究僧10 天前
uniapp的图片上传与提交(Demo记录)
uni-app·vue·图片上传·js
霸王蟹11 天前
Pinia-构建用户仓库和持久化插件
前端·vue.js·笔记·ts·pinia·js
Codingwiz_Joy12 天前
Day14 -实例 -利用工具进行js框架的信息收集
安全·web·js·安全性测试
eli96018 天前
node-ddk,electron 开发组件
前端·javascript·electron·node.js·js
PagiHi19 天前
iWebOffice2015 中间件如何在Chrome107及之后的高版本中加载
前端·javascript·chrome·中间件·edge·js
我命由我1234521 天前
微信小程序项目 tabBar 配置问题:“pages/mine/mine“ need in [“pages“]
javascript·微信小程序·小程序·html·css3·html5·js
秋天爱美丽22 天前
Reflect.get和target[key]有何不同?
es6·js