uniapp h5实现Excel、Word、PDF文件在线预览,而不是跳转下载,也不需要下载

实现方案

word,微软 Office Web Viewer
javascript 复制代码
const url = `https://view.officeapps.live.com/op/view.aspx?src=${encodeURIComponent('https://501351981.github.io/vue-office/examples/dist/static/test-files/test.docx')}`
window.open(url) //新建窗口打开链接预览
//或
window.location.href = (url); //本页面内跳转链接实现预览,留页面历史记录
//或
location.replace(url); //本页面内跳转链接实现预览,不留页面历史记录
excel,微软 Office Web Viewer
javascript 复制代码
const url = `https://view.officeapps.live.com/op/view.aspx?src=${encodeURIComponent('http://static.shanhuxueyuan.com/demo/excel.xlsx')}`
window.open(url) //新建窗口打开链接预览
//或
window.location.href = (url); //本页面内跳转链接实现预览,留页面历史记录
//或
location.replace(url); //本页面内跳转链接实现预览,不留页面历史记录
pdf,pfile的文件预览
javascript 复制代码
const url = `https://view.officeapps.live.com/op/view.aspx?src=${encodeURIComponent('https://www.*********.pdf')}`
window.open(url) //新建窗口打开链接预览
//或
window.location.href = (url); //本页面内跳转链接实现预览,留页面历史记录
//或
location.replace(url); //本页面内跳转链接实现预览,不留页面历史记录

vue-office库

https://www.npmjs.com/package/@vue-office/excel

相关推荐
寒寒_1 小时前
使用Vue与Fabric.js创建图片标注工具
javascript·vue.js·fabric
E_ICEBLUE2 小时前
Python 实现 PDF 表单域的自动化创建与智能填充
python·pdf·自动化·表单域
mCell7 小时前
如何零成本搭建个人站点
前端·程序员·github
mCell8 小时前
为什么 Memo Code 先做 CLI:以及终端输入框到底有多难搞
前端·设计模式·agent
恋猫de小郭8 小时前
AI 在提高你工作效率的同时,也一直在增加你的疲惫和焦虑
前端·人工智能·ai编程
少云清8 小时前
【安全测试】2_客户端脚本安全测试 _XSS和CSRF
前端·xss·csrf
萧曵 丶8 小时前
Vue 中父子组件之间最常用的业务交互场景
javascript·vue.js·交互
银烛木8 小时前
黑马程序员前端h5+css3
前端·css·css3
m0_607076608 小时前
CSS3 转换,快手前端面试经验,隔壁都馋哭了
前端·面试·css3
听海边涛声8 小时前
CSS3 图片模糊处理
前端·css·css3