前端实现在线预览文件

一、实现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>
相关推荐
拆房老料2 天前
5分钟上手 OnlyOffice 连接器,打通业务系统与文档编辑器
编辑器·开源软件·js
zhensherlock7 天前
Protocol Launcher 系列:Mail Assistant 轻松发送 HTML 邮件
前端·javascript·typescript·node.js·html·github·js
cuoluoche7 天前
postman接口请求response是base64-图片这类的可视化。
js
Huanzhi_Lin7 天前
关于V8/MajorGC/MinorGC——性能优化
javascript·性能优化·ts·js·v8·新生代·老生代
百撕可乐8 天前
WenDoraAi官网NextJS实战03:项目插件与Header组件
react.js·js
我命由我123458 天前
React - 组件优化、children props 与 render props、错误边界
前端·javascript·react.js·前端框架·html·ecmascript·js
我命由我1234511 天前
在 React 项目中,配置了 setupProxy.js 文件,无法正常访问 http://localhost:3000
开发语言·前端·javascript·react.js·前端框架·ecmascript·js
CyrusCJA11 天前
Nodejs自定义脚手架
javascript·node.js·js
可问春风_ren13 天前
HTML零基础进阶教程:解锁表单、多媒体与语义化实战
前端·git·html·ecmascript·reactjs·js
我命由我1234516 天前
HTML 开发 - HTML 描述列表标签(<dl>、<dt>、<dd>)
前端·javascript·css·html·css3·html5·js