前端实现在线预览文件

一、实现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>
相关推荐
huangyiyi6666621 小时前
轮询那些事儿
javascript·前端框架·vue·js
Ya-Jun4 天前
快应用TypeError: The ‘compilation‘ argument must be an instance of Compilation错误
node.js·ux·js
歪歪1005 天前
在哪些场景下适合使用 v-model 机制?
服务器·前端·javascript·servlet·前端框架·js
闫辉5 天前
HackerNews 播客生成器
node.js·js
~无忧花开~8 天前
JavaScript学习笔记(二十八):JavaScript性能优化全攻略
开发语言·前端·javascript·笔记·学习·性能优化·js
爱偷懒的。。8 天前
基于 WebSocket 协议的实时弹幕通信机制分析-抖音
网络·python·websocket·网络协议·学习·js
棋子一名11 天前
跑马灯组件 Vue2/Vue3/uni-app/微信小程序
微信小程序·小程序·uni-app·vue·js
EterNity_TiMe_13 天前
上手 Rokid JSAR:新手也能快速入门的 AR 开发之旅
ar·js·rokid
TeleostNaCl14 天前
实战 | 使用 Chrome 开发者工具修改网页源码跳过前端校验
前端·chrome·经验分享·后端·js
吹晚风吧19 天前
什么是跨域?跨域怎么解决?跨域解决的是什么问题?
java·vue.js·js·cors