文档在线预览实现方法 - 好文

介绍：文档预览一般实现步骤为：

1、将文档（word，excel,ppt等）转换为pdf文件格式

2、使用网页展示pdf文件

我使用的是aspose+pdf.js方法实现，使用前者将文档转换为pdf格式，在使用pdf.js插件显示。

将pdf.js插件集成到项目后进行如下操作：

1、aspose内置将（word,excel,ppt）转换为pdf的方法，调用即可。
@RequestMapping("/path/{id}") public void getPath(@PathVariable Integer id,
HttpServletResponse response) throws IOException { File file =
service.getPDFById(id, getUploadPath()); try (FileInputStream input = new
FileInputStream(file)) { inToOut(input, response.getOutputStream()); } catch
(Exception e) { response.getOutputStream().write("预览失败，请重试".getBytes()); } }
2、其中file就是转换好的pdf文件，inToOut()的代码如下:
protected void inToOut(InputStream in, OutputStream out) throws IOException {
byte[] dataByte = new byte[1024]; int l; while ((l = in.read(dataByte)) != -1)
out.write(dataByte, 0, l); }
作用是将文件输入流的内容写到response的输出流中，前端显示即可，代码如下：
if(jQuery.inArray(format,noImg)!=-1){
viewPath="${ctxPath}/plugin/onlineView/web/viewer.html?file=${ctxPath}/${code}/path/"+id;
}else{
viewPath="${ctxPath}/plugin/onlineView/imgView.html?id="+id+"&url=${ctxPath}/${code}/getImgStream/";
}
前者就是是显示我的pdf文件的路径，将其做为a标签的href属性值即可。

附上一个额外知识点：
@ResponseBody @RequestMapping("/getImgStream/{id}") public byte[]
getImgStream(@PathVariable Integer id) { String fileName =
service.findById(id).getUrl(); String filePath = getUploadPath() + "document/"
+ fileName; File file = new File(filePath); byte[] buffer = null; try
(FileInputStream inputFile = new FileInputStream(file)) { buffer = new
byte[inputFile.available()]; inputFile.read(buffer); } catch (IOException e) {
e.printStackTrace(); } return Base64.getEncoder().encode(buffer); }
由于第二个路径是显示图片，所以先获取图片的二进制形式传到前端使用img标签显示即可
$("#img").attr("src","data:image/*;base64,"+data);
data就是我的图片二进制形式

热门工具换一换