前端或JS实现pdf、word、excel、txt等文件在线预览

作者 : admin 本文共972个字,预计阅读时间需要3分钟 发布时间: 2024-06-16 共1人阅读

前端或JS实现pdf、word、excel、txt等文件在线预览

前言
因为业务需要,很多文件需要在前端实现预览,今天就来了解一下吧。

实现方案
找了网上的实现方案,推荐几个前端实现方式,小编推荐使用pfile,亲测好用。
1、pfile的文件预览

   直接调用:http://www.pfile.com.cn/api/profile/onlinePreview?url='+encodeURIComponent(“你的文档地址”) 
   例:window.open("http://www.pfile.com.cn/api/profile/onlinePreview?url='+encodeURIComponent(“你的文档地址”) ")
		  window.location.href="window.open("http://www.pfile.com.cn/api/profile/onlinePreview?url='+encodeURIComponent(“你的文档地址”) ")"
   以上列举两种前端的调用方式,根据你的实现方式来决定,只要嵌入这个pfile的地址就可以了。
   		  
   注意! 注意! 注意!:
   刚开始使用时可能会出现因为你的调用方式的问题(例:1、代码编写时你的地址文档地址有误,2、代码你复制错了 等等),
   导致预览不成功,提示“地址错误”,可加pfile的服务群“531147770”,提供你的“调用地址”并发送“地址调用错误”,
   技术客服会及时给你解决, 给出你正确的调用地址,反馈你的问题,客服服务态度非常好,解决问题非常及时,
   pfile相关问题都会给你解答。
   使用了一阵非常完美,强烈推荐。

使用了一阵完美,强烈推荐。
2、简单的前端处理方式

 

这种方式在不同浏览器上表现不一样,部份手机浏览器直接不能直接不能打开或是表现为下载,基本不实用,如果预览PDF,可以使pdf.js这样的纯JS库但是实际场景用时要做各种格式判断浏览判断麻烦死了。
3、office online

window.open( “https://view.officeapps.live.com/op/view.aspx?src=” + 文档url); //新建窗口打开链接预览

4、前端js

window.location.href = url; //本页面内跳转链接实现预览

PDF好像要单独处理,用了一下感觉不太爽放弃了。

本站无任何商业行为
个人在线分享 » 前端或JS实现pdf、word、excel、txt等文件在线预览
E-->