首页
学习
活动
专区
工具
TVP
发布

pdf.js预览pdf文件流(base64)

1、前言: 新接手一个老项目,需要改造pdf文件预览效果,接口直接返回的pdf文件文件流base64字符串,前端只能拿到base64来进行预览。...pdf.js是一款非常优秀的pdf解析工具,但不支持直接预览文件流,这里需要对pdf.js稍微改造。...,放在webapp下面,我把下载以后的文件解压重新命名为pdfjs文件夹,如图  3、保存pdf文件流 我这里是一个接口返回包括内容详情,图片,pdf文件等所有内容,点击一条pdf记录,跳转打开新的标签页进行预览...打开pdfjs/web下的viewer.html文件,添加js代码,对base64进行处理。...最后pdf预览如图(pdf内容打了马赛克): 另外,更改以后的pdfjs文件夹,已经上传到csdn资源,有需要的可以下载,地址如下: https://download.csdn.net/download

13.9K20
您找到你想要的搜索结果了吗?
是的
没有找到

SpringBoot实现文件在线预览

背景 最近公司内部oa系统升级,需要增加文件在线预览服务,最常见的文件就是office文档,一开始构思几个方案,比如office软件自带的文件转换,openoffice转换,offce365服务,aspose...组件转换,最终采用了aspose转换,原因是组件功能完善,不依赖其它软件安装环境 系统设计 文件类型及方案 文件类型 预览方案 word aspsoe-word转换图片预览(版本21.1) ppt aspose-slides...转化你图片预览(版本20.4) excel aspose-cell转换html预览(版本20.4) pdf pdfbox缓缓图片预览(版本2.0.15) png,jpg,gif 整合viewer.js预览...(版本1.5.0) mp4 整合vedio.js预览js版本7.10.2) txt 读取文件内容预览 注:aspose因版权问题,工程示例代码中全部使用试用版,转换图片会出现水印 流程设计 系统实现...file=(文件地址) 文件地址支持文件访问路径与流输出 项目源码地址 https://gitee.com/code2roc/fast-preview 预览界面 word excel ppt pdf

44420

JAVA实现文件预览功能

近期做的项目要求实现文件在线预览功能,可支持多种文件类型,TXT,DOC,PDF,XLS , 最好支持压缩包的预览功能.没办法,只能网上找啊 看了个遍,都是些不靠谱的,转来转去的一个能用的都没有,付费的产品有永中啊...下完后 整个项目的结构如图,至于什么SpringBoot的 大家去搜好了 肯定比我讲的好,你们只要会用就行了. down下来 改了下配置 主要是 application-dev.properties这个文件需要改动...这个是楼主的配置 桌面上建立一个 demo 的文件夹 哦 差点忘记了 记得下载 Open office 安装就默认路径就行 图标如下图 网上的下载都比较慢 大家可以用我分享的链接下载 不用谢...Redis 也不要忘了哈 怎么安装 这个大家都会 Redis 服务 和 OpenOffice服务开启后 直接启动项目 直接运行这个main 方法 楼主端口是8012 直接浏览器 直接上传文件就可以了...楼主传了个压缩包 来看下效果 完美预览成功 再试个 word 也是成功 好了 推荐大家试用下 有什么问题可以来问我 发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn

2.6K30

组件分享之前端组件——基于pdf.js在线预览PDF文件

组件分享之前端组件——基于pdf.js在线预览PDF文件 背景 近期正在探索前端、后端、系统端各类常用组件与工具,对其一些常见的组件进行再次整理一下,形成标准化组件专题,后续该专题将包含各类语言中的一些常用组件...组件基本信息 组件:pdf.js 开源协议:Apache-2.0 许可证 使用与下载:https://mozilla.github.io/pdf.js/ 内容 本次分享的组件是用于在浏览器中在线查看...下面是其开源库中的描述内容: PDF.js是使用 HTML5 构建的可移植文档格式 (PDF) 查看器。 PDF.js 由社区驱动并受 Mozilla 支持。...1、创建一个html页面,并在其中增加如下代码 PDF.js '...中增加如下代码进行加载需要在线展示的pdf文件 // 如果提供了来自远程服务器的绝对URL,则在该服务器上配置CORS头。

4.8K20

office文件 vue 预览_vue实现pdf文档在线预览功能

针对android系统不支持pdf文档在线预览,可通过引入pdf.js插件实现,其具体实现步骤如下 一、引入插件 方式一:npm install –save pdfjs-dist,安装完成后在vue项目的...node_modules出现如下依赖 方式二:只引入pdf.js的核心文件pdf.js和pdf.work.js,其他无关的文件全部删除 方式三:将插件直接放在static文件夹下 二、前端页面代码 方式一和方式二...let url = ‘/static/pdf/web/compressed.tracemonkey-pldi-09.pdf’ // 跨域请求文件,需要走后台代理,后台需要将文件流返回前端才可在页面显示...,此种方式的filePath如为本地文件不进行编码也可发送请求,如为跨域文件不进行编码无法发送请求,因此建议统一进行编码。...outputStream); } catch (Exception e) { e.printStackTrace(); } return null; } } 具体采用哪种方式实现pdf文档的在线预览

3K10

基于SpringBoot的文件在线预览神器,可支持99%常用文件的在线预览

在上一篇 文章中,我们使用MinIO实现了文件存储,用于存储各种格式的文件。有时候我们不仅需要文件存储,还需要文件的在线预览。...这里给大家推荐一个基于SpringBoot的文件预览神器kkFileView,基本支持主流文件的在线预览,使用也很简单,希望对大家有所帮助!...Examples即可,注意修改下version为2012-10-17; 修改成功后就可以在线预览文件了,我们来看下在线预览文件的URL格式,只需传入url(需要预览文件地址)即可,这里要注意的是这个...pdf和JPG来实现预览的; 再来预览下pdf文档,和上面两个并没有啥区别; 再来预览下excel文档,这预览效果有待提高; 再来预览下纯文本的Markdown文档; 最后再来预览下压缩文件,支持查看压缩文件中的内容...,点击文件可直接预览

1.7K60
领券