前端页面预览word_jquery.media.js实现前端页面预览
预览doc
预览docx
预览pdf
预览pdf
×
function toView(filePath){
var url = [[@{/converter/preview}]]+'?filePath='+filePath;
$(".modal-body").empty();
$(".modal-body").load(url);
$("#previewModal").modal();
}
function toPdfView(filePath){
var url = [[@{/converter/viewPdf}]]+'?filePath='+filePath;
$(".modal-body").empty();
$(".modal-body").append('预览pdf');
$("a.media").attr("href",[[@{/converter/viewPdf}]]+'?filePath='+filePath);
$("#previewModal").modal();
$("a.media").attr("href",url)
$("a.media").media({width:960,height:800});
}
$("#previewModal").on("hide.bs.modal",function(){
$(this).removeData("bs.modal");
});
java代码
import java.awt.Image;
import java.awt.image.BufferedImage;
import java.io.BufferedOutputStream;
import java.io.ByteArrayInputStream;
import java.io.ByteArrayOutputStream;
import java.io.File;
import java.io.FileInputStream;
import java.io.IOException;
import java.io.InputStream;
import javax.imageio.ImageIO;
import javax.servlet.http.HttpServletResponse;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.beans.factory.annotation.Value;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import com.bjdjjs.utils.converter.WordToHtml;
@Controller
@RequestMapping(value = "/converter")
public class OfficeConterverController {
protected final Logger logger = LoggerFactory.getLogger(OfficeConterverController.class);
@Value("${image.temp.folder}")
private String ImageTempFolder;
@Value("${server.context-path}")
private String contextPath;
@RequestMapping(value = "/preview")
public String preview(HttpServletResponse response,
@RequestParam(value = "filePath", required=true) String filePath){
logger.info("预览文件:"+filePath);
WordToHtml wh = new WordToHtml(ImageTempFolder,contextPath);
ByteArrayOutputStream htmlOutputStream = wh.change(filePath);
try{
BufferedOutputStream bos = new BufferedOutputStream(response.getOutputStream());
bos.write(htmlOutputStream.toByteArray());
bos.close();
htmlOutputStream.flush();
}catch (Exception e) {
e.printStackTrace();
} finally{
if(htmlOutputStream != null){
try {
htmlOutputStream.close();
} catch (IOException e) {
e.printStackTrace();
}
}
}
return null;
}
@RequestMapping(value = "/viewPdf")
public String viewPdf(HttpServletResponse response,
@RequestParam(value = "filePath", required=true) String filePath){
logger.info("预览文件:"+filePath);
response.setContentType("application/pdf");
try{
InputStream pdfInputStream = new FileInputStream(filePath);
BufferedOutputStream bos = new BufferedOutputStream(response.getOutputStream());
int pdfByte;
while((pdfByte = pdfInputStream.read()) != -1){
bos.write(pdfByte);
}
pdfInputStream.close();
bos.close();
}catch (Exception e) {
e.printStackTrace();
return null;
}
return null;
}
@RequestMapping(value = "/fetchImage")
public String fetchImage(HttpServletResponse response,
@RequestParam(value = "n", required=true) String fileName){
logger.info("获取图片:"+fileName);
try {
BufferedImage image = ImageIO.read(new File(ImageTempFolder+fileName));
ImageIO.write(image, "png", response.getOutputStream());
response.setContentType("image/png");
ImageIO.write(image, "png", response.getOutputStream());
} catch (IOException e) {
e.printStackTrace();
}
return null;
}
@RequestMapping(value = "/test")
public String test(){
logger.info("测试页面");
return "test/preview";
}
}
工具类
package com.bjdjjs.utils.converter;
import java.io.ByteArrayOutputStream;
import java.io.File;
import java.io.FileInputStream;
import java.io.FileNotFoundException;
import java.io.FileOutputStream;
import java.io.IOException;
import java.io.InputStream;
import java.util.List;
import javax.imageio.ImageIO;
import javax.xml.parsers.DocumentBuilderFactory;
import javax.xml.parsers.ParserConfigurationException;
import javax.xml.transform.OutputKeys;
import javax.xml.transform.Transformer;
import javax.xml.transform.TransformerException;
import javax.xml.transform.TransformerFactory;
import javax.xml.transform.dom.DOMSource;
import javax.xml.transform.stream.StreamResult;
import org.apache.poi.hwpf.HWPFDocument;
import org.apache.poi.hwpf.converter.PicturesManager;
import org.apache.poi.hwpf.converter.WordToHtmlConverter;
import org.apache.poi.hwpf.usermodel.Picture;
import org.apache.poi.hwpf.usermodel.PictureType;
import org.apache.poi.xwpf.converter.core.BasicURIResolver;
import org.apache.poi.xwpf.converter.core.FileImageExtractor;
import org.apache.poi.xwpf.converter.core.FileURIResolver;
import org.apache.poi.xwpf.converter.core.IURIResolver;
import org.apache.poi.xwpf.converter.xhtml.XHTMLConverter;
import org.apache.poi.xwpf.converter.xhtml.XHTMLOptions;
import org.apache.poi.xwpf.usermodel.XWPFDocument;
import org.apache.poi.xwpf.usermodel.XWPFPictureData;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.w3c.dom.Document;
public class WordToHtml {
protected final Logger logger = LoggerFactory.getLogger(WordToHtml.class);
private String ImageTempFolder;
private String contextPath;
//返回图片请求地址
private static String ImageRequestMap = "/converter/fetchImage?n=";
private static String WORD2003 = "doc";
private static String WORD2007 = "docx";
public WordToHtml(String imageTempFolder,String contextPath){
this.ImageTempFolder = imageTempFolder;
this.contextPath = contextPath;
}
public ByteArrayOutputStream change(String filePath) {
int index = filePath.lastIndexOf(".");
String fileType = filePath.substring(index+1, filePath.length());
try {
if(WORD2003.equalsIgnoreCase(fileType))
return convert2Html(filePath);
else if(WORD2007.equalsIgnoreCase(fileType))
return xconvert2Html(filePath);
} catch (Exception e) {
e.printStackTrace();
}
return null;
}
public ByteArrayOutputStream convert2Html(String filePath)
throws TransformerException, IOException,
ParserConfigurationException {
HWPFDocument wordDocument = new HWPFDocument(new FileInputStream(filePath));//创建一个文档
WordToHtmlConverter wordToHtmlConverter = new WordToHtmlConverter(
DocumentBuilderFactory.newInstance().newDocumentBuilder()
.newDocument());//对普通文本的操作
wordToHtmlConverter.setPicturesManager( new PicturesManager()
{
public String savePicture( byte[] content,
PictureType pictureType, String suggestedName,
float widthInches, float heightInches )
{
return contextPath+ImageRequestMap+suggestedName;
}
} );//对图片的操作
wordToHtmlConverter.processDocument(wordDocument);
//保存图片
List pics=wordDocument.getPicturesTable().getAllPictures();
if(pics!=null){
for(int i=0;i
Picture pic = (Picture)pics.get(i);
System.out.println();
try {
pic.writeImageContent(new FileOutputStream(ImageTempFolder
+ pic.suggestFullFileName()));
} catch (FileNotFoundException e) {
e.printStackTrace();
}
}
}
Document htmlDocument = wordToHtmlConverter.getDocument();
ByteArrayOutputStream out = new ByteArrayOutputStream();
DOMSource domSource = new DOMSource(htmlDocument);
StreamResult streamResult = new StreamResult(out);
TransformerFactory tf = TransformerFactory.newInstance();
Transformer serializer = tf.newTransformer();
serializer.setOutputProperty(OutputKeys.ENCODING, "UTF-8");
serializer.setOutputProperty(OutputKeys.INDENT, "yes");
serializer.setOutputProperty(OutputKeys.METHOD, "html");
serializer.transform(domSource, streamResult);
out.close();
return out;
}
public ByteArrayOutputStream xconvert2Html(String filePath)
throws TransformerException, IOException,
ParserConfigurationException {
InputStream inputStream = new FileInputStream(new File(filePath));
XWPFDocument document = new XWPFDocument(inputStream);
XHTMLOptions options = XHTMLOptions.create().indent(1);
File imageFolderFile =new File(ImageTempFolder);
FileImageExtractor extractor = new FileImageExtractor(imageFolderFile);
options.setExtractor(extractor);
options.setIgnoreStylesIfUnused(false);
options.setFragment(true);
options.URIResolver(new BasicURIResolver(contextPath+ImageRequestMap));
ByteArrayOutputStream out = new ByteArrayOutputStream();
XHTMLConverter.getInstance().convert(document, out, options);
out.close();
return out;
}
}
分享到:
2018-01-05 11:08
浏览 4510
评论
前端页面预览word_jquery.media.js实现前端页面预览相关推荐
- jquery.media.js 插件实现在线预览PDF文件
代码: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" con ...
- vue本地上传并预览php,vue.js 实现图片本地预览 裁剪 压缩 上传功能
以下代码涉及 Vue 2.0 及 ES6 语法. 目标 纯 javascrpit 实现,兼容ie9及以上浏览器,在本地做好文件格式.长宽.大小的检测,减少浏览器交互. 现实是残酷的,为了兼容Ie9 还 ...
- php手机端多图预览上传,JS实现多图预览上传的实例代码
这篇文章主要介绍了JS实现多张图片预览同步上传功能的相关资料,需要的朋友可以参考下 废话不多说了,直接给大家贴代码了,具体代码如下所示: /** * Created by liujing on 201 ...
- 前端进阶试题css(来自js高级前端开发---豪情)既然被发现了HOHO,那我就置顶了嘿嘿!觉得自己技术OK的可以把这套题目做完哦,然后加入高级前端的社区咯...
http://www.cnblogs.com/jikey/p/4426105.html js高级前端开发加群方法(此群很难进,里面纯技术,严禁广告,水群) 完整题目做完发邮箱(jikeytang@16 ...
- PDF在线预览插件touchPDF.js:手机端预览
接上一篇web端预览,博主找了一篇关于手机端的预览插件,丑是丑了点,但是能用,下面就来介绍一下吧! PDF在线预览插件:手机端预览 1.编辑界面的HTML代码 2.第二步就没了 3.既然这样那我们直接 ...
- 使用js动态控制html页面缩放
今天拿到的需求:pad版本的页面在手机上要适配,我真是一口老血 最快的方法是缩放页面,核心问题: js动态控制html页面缩放 搜到别人写的 js控制页面缩放_江-月*夜的博客-CSDN博客_js 控 ...
- 继鹅厂前端No.1离职后,据传阿里前端No.1近日毕业
上一篇:为什么互联网大厂一边裁员,一边招人? 继鹅厂前端No.1离职后,据传阿里前端No.1前天毕业 就在上个月,腾讯前端级别zui高专家,职级T13的前端级别黄希彤官宣被裁,其夫人在小红书还开设了专 ...
- SpringBoot+libreoffice+jquery.media.js实现office文档在线预览
一.主要思路 主要思路是文档先通过后台转成PDF临时文件,预览时前端用jquery.media.js打开显示,小文件打开速度秒开,大文件可能会耗时久一点. 二.libreoffices安装 下载地址, ...
- 前端页面预览word_详解html实现在线预览word、excel、pdf等文件的功能(附代码)_WEB前端开发...
JavaScript判断"字典"为空的方法_WEB前端开发 字典是一种存储键值对的数据结构,Javascript中的Object类内部即实现为一个字典,本文就来为大家介绍一下判断字 ...
最新文章
- NLP模型也有“老师”了!装上这个开源库,1毫秒纠正语法错误
- Spring越来越强,而我们越来越快餐!离开了Spring,居然API都写不出来了!
- 电子邮件成企业主动营销的首选工具
- java 20 -3 递归之删除特定目录下的特定文件
- EasyUI中tree,Datagrid,pagenation的使用EasyUI中Datagrid和pagenation进行关联时,再次点击pagenation时让表格数据显示的问题
- springboot项目中使用日志
- 2020牛客暑期多校训练营(第六场)
- C# Winform 使用二维码
- Python 函数 -next()
- 游戏玩家的图形显示设置指南(11)(The Gamer's Graphics Display Settings Guide)
- c++整人小程序(附源码)
- 企业邮箱安全中心在哪里,TOM邮箱安全设置中心
- 看得见的数据结构Android版之二分搜索树篇
- 2_竞赛无人机基础飞行控制函数——零基础学习竞赛无人机搭积木式编程
- OpenStack 归档 - 虚拟机临时存储与块存储
- 有的项目是没有seting ,.project文件的,import时not project found处理办法
- JQuery属性选择器(属性值是变量、多属性选择)
- 解决idea集成maven在使用骨架构建项目报错问题
- Openlayers各种下载方法
- 【人工智能】AI究竟能为你的生意做什么(以及不能做什么)