Loading [MathJax]/jax/input/TeX/config.js
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >SpringBoot实现文件在线预览

SpringBoot实现文件在线预览

作者头像
code2roc
发布于 2023-07-19 07:00:16
发布于 2023-07-19 07:00:16
79900
代码可运行
举报
运行总次数:0
代码可运行

背景

最近公司内部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因版权问题,工程示例代码中全部使用试用版,转换图片会出现水印

流程设计

系统实现

识别文件后缀

URL指向文件真实路径时根据后缀名判断

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
    public static String getTypeByExtenssion(String linkUrl) {
        if (linkUrl == null)
            return null;
        linkUrl = linkUrl.toLowerCase();
        for (String ext : extensions) {
            if (linkUrl.endsWith(ext)) {
                return ext;
            }
        }
        return null;
    }

URL为文件输出流时

  • 根据文件输出流的disposition
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
    private static String getTypeByDisposition(String disposition) {
        String ext = null;
        if (!StringUtils.isEmpty(disposition)) {
            disposition = StringUtils.replace(disposition, "\"", "");
            String[] strs = disposition.split(";");
            for (String string : strs) {
                if (string.toLowerCase().indexOf("filename=") >= 0) {
                    ext = StringUtils.substring(string, string.lastIndexOf("."));
                    break;
                }
            }
        }
        return ext;
    }
  • 根据文件输出流content-type
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
        types = new HashMap<String, String>();
        types.put("application/pdf", ".pdf");
        types.put("application/msword", ".doc");
        types.put("text/plain", ".txt");
        types.put("application/javascript", ".js");
        types.put("application/x-xls", ".xls");
        types.put("application/-excel", ".xls");
        types.put("text/html", ".html");
        types.put("application/x-rtf", ".rtf");
        types.put("application/x-ppt", ".ppt");
        types.put("image/jpeg", ".jpg");
        types.put("application/vnd.openxmlformats-officedocument.wordprocessingml.template", ".docx");
        types.put("application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", ".xlsx");
        types.put("application/vnd.openxmlformats-officedocument.presentationml.presentation", ".pptx");
        types.put("message/rfc822", ".eml");
        types.put("application/xml", ".xml");
  • 根据stream的固定字节判断
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
        FILE_TYPE_MAP.put(".pdf", "255044462D312E"); // Adobe Acrobat (pdf)
        FILE_TYPE_MAP.put(".doc", "D0CF11E0"); // MS Word
        FILE_TYPE_MAP.put(".xls", "D0CF11E0"); // MS Excel 注意:word 和 excel的文件头一样
        FILE_TYPE_MAP.put(".jpg", "FFD8FF"); // JPEG (jpg)
        FILE_TYPE_MAP.put(".png", "89504E47"); // PNG (png)
        FILE_TYPE_MAP.put(".gif", "47494638"); // GIF (gif)
        FILE_TYPE_MAP.put(".tif", "49492A00"); // TIFF (tif)
        FILE_TYPE_MAP.put(".bmp", "424D"); // Windows Bitmap (bmp)
        FILE_TYPE_MAP.put(".dwg", "41433130"); // CAD (dwg)
        FILE_TYPE_MAP.put(".html", "68746D6C3E"); // HTML (html)
        FILE_TYPE_MAP.put(".rtf", "7B5C727466"); // Rich Text Format (rtf)
        FILE_TYPE_MAP.put(".xml", "3C3F786D6C");
        FILE_TYPE_MAP.put(".zip", "504B0304"); // docx的文件头与zip的一样
        FILE_TYPE_MAP.put(".rar", "52617221");
        FILE_TYPE_MAP.put(".psd", "38425053"); // Photoshop (psd)
        FILE_TYPE_MAP.put(".eml", "44656C69766572792D646174653A"); // Email
        FILE_TYPE_MAP.put(".dbx", "CFAD12FEC5FD746F"); // Outlook Express (dbx)
        FILE_TYPE_MAP.put(".pst", "2142444E"); // Outlook (pst)
        FILE_TYPE_MAP.put(".mdb", "5374616E64617264204A"); // MS Access (mdb)
        FILE_TYPE_MAP.put(".wpd", "FF575043"); // WordPerfect (wpd)
        FILE_TYPE_MAP.put(".eps", "252150532D41646F6265");
        FILE_TYPE_MAP.put(".ps", "252150532D41646F6265");
        FILE_TYPE_MAP.put(".qdf", "AC9EBD8F"); // Quicken (qdf)
        FILE_TYPE_MAP.put(".pwl", "E3828596"); // Windows Password (pwl)
        FILE_TYPE_MAP.put(".wav", "57415645"); // Wave (wav)
        FILE_TYPE_MAP.put(".avi", "41564920");
        FILE_TYPE_MAP.put(".ram", "2E7261FD"); // Real Audio (ram)
        FILE_TYPE_MAP.put(".rm", "2E524D46"); // Real Media (rm)
        FILE_TYPE_MAP.put(".mpg", "000001BA"); //
        FILE_TYPE_MAP.put(".mov", "6D6F6F76"); // Quicktime (mov)
        FILE_TYPE_MAP.put(".asf", "3026B2758E66CF11"); // Windows Media (asf)
        FILE_TYPE_MAP.put(".mid", "4D546864"); // MIDI (mid)

文件解析

word分页转换图片

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
Document doc = new Document(fileConvertInfo.getFilePath());
for (int i = 0; i < doc.getPageCount(); i++) {
    Document extractedPage = doc.extractPages(i, 1);
    extractedPage.save(fileConvertInfo.getFileDirPath() + "split_" + (i + 1) + ".jpeg", SaveFormat.JPEG);
}

ppt分页转换图片

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
Presentation ppt = new Presentation(fileConvertInfo.getFilePath());
    for (int i = 0; i < ppt.getSlides().size(); i++) {
       ISlide slide = ppt.getSlides().get_Item(i);
       int height = (int) (ppt.getSlideSize().getSize().getHeight() - 150);
       int width = (int) (ppt.getSlideSize().getSize().getWidth() - 150);
       BufferedImage image = slide.getThumbnail(new java.awt.Dimension(width, height));
       //每一页输出一张图片
       File outImage = new File(fileConvertInfo.getFileDirPath() + "split_" + (i + 1) + ".jpeg");
       ImageIO.write(image, "jpeg", outImage);
}

excel转换html

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
Workbook wb = new Workbook(fileConvertInfo.getFilePath());
HtmlSaveOptions opts = new HtmlSaveOptions();
opts.setExportWorksheetCSSSeparately(true);
opts.setExportSimilarBorderStyle(true);
Worksheet ws = wb.getWorksheets().get(0);
wb.save(fileConvertInfo.getFileDirPath() + "convert.html", opts);

excel分页转换图片(另一种预览方式)

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
Workbook wb = new Workbook(fileConvertInfo.getFilePath());
ImageOrPrintOptions imgOptions = new ImageOrPrintOptions();
imgOptions.setImageFormat(ImageFormat.getJpeg());
for (int i = 0; i < wb.getWorksheets().getCount(); i++) {
	Worksheet sheet = wb.getWorksheets().get(i);
	SheetRender sr = new SheetRender(sheet, imgOptions);
    sr.toImage(i, fileConvertInfo.getFileDirPath() + "split_" + (i + 1) + ".jpeg");
}

pdf分页转换图片

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
PDDocument pdf = PDDocument.load(new File((fileConvertInfo.getFilePath())));
int pageCount = pdf.getNumberOfPages();
PDFRenderer renderer = new PDFRenderer(pdf);
for (int i = 0; i < pageCount; i++) {
     BufferedImage image = renderer.renderImage(i, 1.25f); // 第二个参数越大生成图片分辨率越高,转换时间也就越长
     ImageIO.write(image, "JPEG", new File(fileConvertInfo.getFileDirPath() + "split_" + (i + 1) + ".jpeg"));
}
pdf.close();

预览图片

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<body>
<div id="app">
    <img id="image"  style="display: none">
</div>
</body>

</html>
<script>
    $(function () {
        $("#image").attr("src", getQueryString("file"));
        var image = new Viewer(document.getElementById('image'),{
            url: 'data-original',
            button:false,
            navbar:false,
            backdrop: false
        });
        document.getElementById('image').click();
    })
</script>

预览视频

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<body>
<div id="app">
    <video id="myvideo" class="video-js vjs-big-play-centered" controls data-setup="{}" width="1366" height="768" preload="auto">
        <source id="vedio" src="//vjs.zencdn.net/v/oceans.mp4" type="video/mp4"></source>
    </video>
</div>
</body>

</html>
<script>
    $(function () {
        $("#vedio").attr("src", getQueryString("file"));
    })
</script>

系统效果

使用方法

直接运行项目,输入预览地址

http://localhost:8098/fastpreview/plaform/index.html?file=(文件地址)

文件地址支持文件访问路径与流输出

项目源码地址

https://gitee.com/code2roc/fast-preview

预览界面

word

excel

ppt

pdf

image

vedio

txt

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2021-10-16,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
前端【vue】实现文档在线预览功能,在线预览pdf、word、xls、ppt等office文件
XDOC可以实现预览以DataURI表示的DOC文档,此外XDOC还可以实现文本、带参数文本、html文本、json文本、公文等在线预览,具体实现方法请看官方文档下面这种方式可以实现快速预览word但是对文件使用的编辑器可能会有一些限制
江一铭
2022/06/17
26K2
前端【vue】实现文档在线预览功能,在线预览pdf、word、xls、ppt等office文件
基于SpringBoot的文件在线预览神器,可支持99%常用文件的在线预览!
kkFileView可以用来搭建文件在线预览服务,在Github上已有5.7k+Star。该项目使用流行的SpringBoot搭建,易上手和部署,基本支持主流办公文档的在线预览,如docx、xlsx、pptx、pdf、txt、zip、图片、视频、音频等等。项目特性可以参考下图。
macrozheng
2021/08/20
2.3K0
Excel转PDF工具类
用户9363686
2025/01/17
1660
aspose转换xlsx and doc and docx to pdf去水印无页数限制
license.xml.rp.ce https://qweqwe123.lanzoub.com/ibj1f174h9hg
用户10738827
2023/09/25
1.2K4
java利用 aspose-words Word或Excel 转Pdf(无水印、页数限制)
word转pdf需要引入 aspose-words-15.8.0-jdk16.jar
全栈程序员站长
2022/09/01
7.4K0
java利用 aspose-words Word或Excel 转Pdf(无水印、页数限制)
java实现在线预览–poi实现word、excel、ppt转html
###简介 java实现在线预览功能是一个大家在工作中也许会遇到的需求,如果公司有钱,直接使用付费的第三方软件或者云在线预览服务就可以了,例如永中office、office web 365(http://www.officeweb365.com/)他们都有云在线预览服务,就是要钱0.0 如果想要免费的,可以用openoffice,还需要借助其他的工具(例如swfTools、FlexPaper等)才行,可参考这篇文章http://blog.csdn.net/z69183787/article/details/17468039,写的挺细的,实现原理就是: 1.通过第三方工具openoffice,将word、excel、ppt、txt等文件转换为pdf文件; 2.通过swfTools将pdf文件转换成swf格式的文件; 3.通过FlexPaper文档组件在页面上进行展示。 当然如果装了Adobe Reader XI,那把pdf直接拖到浏览器页面就可以直接打开预览,这样就不需要步骤2、3了,前提就是客户装了Adobe Reader XI这个pdf阅读器。 我这里介绍通过poi实现word、excel、ppt转html,这样就可以放在页面上了。
全栈程序员站长
2022/09/06
2.3K0
万能在线预览 kkFileView v4.2.0 正式发布
kkFileView 自 2017 年开源至今,已经支持 23 种文件类型,上百种文件后缀的文件在线预览。已在 Gitee 收获 17.2K 、Github 收获 8.2K star, 我们一直在精心打磨 kkFileView ,旨在打造开源里最好用最强大的文件在线预览项目。
kl博主
2023/04/13
4.5K0
Vue 通过调用文件流实现 PDF 文件在线预览的方法
如果后端返回的是PDF文件在服务器上的路径,直接访问该路径即可在浏览器中预览PDF文件。例如,后端返回路径http://example.com/path/to/file.pdf,在前端可以通过如下方式实现预览:
小焱
2025/05/19
2.5K0
Vue 通过调用文件流实现 PDF 文件在线预览的方法
SpringBoot实现万能文件在线预览,已开源,真香!!!
kkFileView,一款成熟且开源的文件文档在线预览项目解决方案,对标业内付费产品有【永中office】【office365】【idocv】等,免费!
程序员小猿
2021/12/15
1.3K0
SpringBoot实现万能文件在线预览,已开源,真香!!!
Spring Boot搭建的一个在线文件预览系统!支持ppt、doc等多种类型文件预览
总的来说我觉得 kkFileView 是一个非常棒的开源项目,在线文件预览这个需求非常常见。感谢开源!
Guide哥
2020/10/30
7.4K0
Spring Boot搭建的一个在线文件预览系统!支持ppt、doc等多种类型文件预览
基于springboot架构的读取excel 图片并自动上传
六月的雨在Tencent
2024/03/28
2790
基于springboot架构的读取excel 图片并自动上传
万能文件在线预览项目,开源!
大家好,我是鱼皮,今天分享一个优秀的、100% 开源、持续更新的项目,拿来学习或者作为项目经历写在简历上都很不错。
程序员鱼皮
2021/05/19
3.1K0
CSharp中文档转换为PDF或图片不依赖WPS或Office
https://gitee.com/psvmc/document-converter.git
码客说
2023/04/27
1.1K0
文档在线预览的实现
最近在研究企业文档管理,这个是基本上所有企业都需要的软件,当然也是有很多种解决方案。对于企业文档来说,最基本的需求就是独立存储,共享。这种需求只需要建立一个Windows共享文件夹或者架一个Samba服务器即可实现,无法做复杂的权限管理,统计等。另一种方案就是架一个Web应用,比如SharePoint,就可以实现。
深蓝studyzy
2022/06/16
4.1K0
使用aspose把各种文件转换成pdf
此处提供转pdf的代码,不同文件转pdf或别的格式都需要不同的jar包,下载地址:在这里插入代码片 https://download.csdn.net/download/bianqing0305/11274829 其中包含lisence.xml
全栈程序员站长
2022/09/05
1.9K0
基于Metronic的Bootstrap开发框架经验总结(7)--数据的导入、导出及附件的查看处理
在很多系统模块里面,我们可能都需要进行一定的数据交换处理,也就是数据的导入或者导出操作,这样的批量处理能给系统用户更好的操作体验,也提高了用户录入数据的效率。我在较早时期的EasyUI的Web框架上,也介绍过通过Excel进行的数据导入导出操作,随笔文章为《基于MVC4+EasyUI的Web开发框架经验总结(10)--在Web界面上实现数据的导入和导出》,本文基于Bootstrap的框架基础上,再对这个模块进行更新处理,以及Office文档或者图片等附件的查看处理。 1、数据的导入操作  一般系统模块里面,
MonroeCode
2018/02/09
1.8K0
基于Metronic的Bootstrap开发框架经验总结(7)--数据的导入、导出及附件的查看处理
企业微信系列之JSSDK文件预览对接
通过使用企业微信JS-SDK,网页开发者可借助企业微信高效地使用拍照、选图、语音、位置等手机系统的能力,同时可以直接使用企业微信分享、扫一扫等企业微信特有的能力,为企业微信用户提供更优质的网页体验。
SmileNicky
2021/05/14
3.4K1
SpringBoot:kkFileView万能文件在线预览(已开源)
在之前的文章中,我们使用MinIO实现了文件存储,用于存储各种格式的文件。有时候我们不仅需要文件存储,还需要文件的在线预览。这里给大家推荐一个基于SpringBoot的文件预览神器kkFileView,基本支持主流文件的在线预览,使用也很简单,希望对大家有所帮助!
Freedom123
2024/03/29
7.3K0
SpringBoot:kkFileView万能文件在线预览(已开源)
springboot实战之office文档在线预览
文档在线预览在企业级应用开发也算是比较常遇见的需求了,通常处理这方面的需求大致有如下的方案,
lyb-geek
2019/11/27
7.8K0
springboot实战之office文档在线预览
React 实现 PDF 文件在线预览 - 手把手教你写 React PDF 预览功能
本文完整版:《React 实现 PDF 文件在线预览 - 手把手教你写 React PDF 预览功能》
蒋川@卡拉云
2022/05/30
5.5K0
React 实现 PDF 文件在线预览 - 手把手教你写 React PDF 预览功能
推荐阅读
相关推荐
前端【vue】实现文档在线预览功能,在线预览pdf、word、xls、ppt等office文件
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验