本想做成类似QQ和网易邮箱附件类似的预览效果,未果!
下边例子是在网上找了一个网友做的例子,在次记录
1.概述
主要原理
1.通过第三方工具openoffice,将word、excel、ppt、txt等文件转换为pdf文件
2.通过swfTools将pdf文件转换成swf格式的文件
3.通过FlexPaper文档组件在页面上进行展示
2.安装包下载
1.openoffice是Apache下的一个开放免费的文字处理软件
下载地址:Apache oppenoffice 官网下载 版本-3.4.1
2.SWFTools是一组用来处理Flash的swf文件的工具包,我们使用它将pdf文件转成swf文件!
下载地址:SWFTools官网下载 swftools-2013-04-09-1007.exe
3.FlexPaper是一个开源轻量级的在浏览器上显示各种文档的组件
4.JODConverter一个Java的OpenDocument 文件转换器,在此我们只用到它的jar包
下载地址:JODCConverter下载
3.安装文件
1.将所下载的文件(JODConverter除外)进行安装,盘符可随自己设定!需要注意的是在openoffice安装完成后,当我们使用它时,需将它的服务打开。在次我们需要以命令的方式打开:
打开dos窗口,进入openoffice安装盘符,输入以下代码来启动服务:
soffice -headless -accept="socket,host=127.0.0.1,port=8100;urp;" -nofirststartwizard
注意最后一个命令前边的‘—’,可不要写错!服务起不来,项目可是继续不下去的哦.
官网启动服务截图如下:
本地截图:
3.开发过程
1.新建项目,将flexpaper文件中的js文件夹(包含了flexpaper_flash_debug.js,flexpaper_flash.js,jquery.js,这三个js文件主要是预览swf文件的插件)拷贝至网站根目录;将FlexPaperViewer.swf拷贝至网站根目录下(该文件主要是用在网页中播放swf文件的播放器),目录结构如下图:
注:需创建upload文件夹
2.创建fileUpload.jsp
1. <%@ page language="java" contentType="text/html; charset=UTF-8"
2. pageEncoding="UTF-8"%>
3. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
4. <html>
5. <head>
6. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
7. <title>文档在线预览系统</title>
8. <style>
9. body {margin-top:100px;background:#fff;font-family: Verdana, Tahoma;}
10. a {color:#CE4614;}
11. #msg-box {color: #CE4614; font-size:0.9em;text-align:center;}
12. #msg-box .logo {border-bottom:5px solid #ECE5D9;margin-bottom:20px;padding-bottom:10px;}
13. #msg-box .title {font-size:1.4em;font-weight:bold;margin:0 0 30px 0;}
14. #msg-box .nav {margin-top:20px;}
15. </style>
16.
17. </head>
18. <body>
19. <div id="msg-box">
20. <form name="form1" method="post" enctype="multipart/form-data" action="docUploadConvertAction.jsp">
21. <div class="title">
22. 请上传要处理的文件,过程可能需要几分钟,请稍候片刻。
23. </div>
24. <p>
25. <input name="file1" type="file">
26. </p>
27. <p>
28. <input type="submit" name="Submit" value="上传">
29. </p>
30. </form >
31. </div>
32. </body>
33. </html>
3.创建转换页docUploadConvertAction.jsp
1. <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
2.
3. <%@page import="java.io.*"%>
4. <%@page import="java.util.Enumeration"%>
5. <%@page import="com.oreilly.servlet.MultipartRequest"%>
6. <%@page import="com.oreilly.servlet.multipart.DefaultFileRenamePolicy"%>
7. <%@page import="com.cectsims.util.DocConverter"%>
8. <%
9. //文件上传采用cos组件上传,可更换为commons-fileupload上传,文件上传后,保存在upload文件夹
10. //获取文件上传路径
11. String saveDirectory =application.getRealPath("/")+"upload";
12. //打印上传路径信息
13. System.out.println(saveDirectory);
14. //每个文件最大50m
15. int maxPostSize = 50 * 1024 * 1024 ;
16. //采用cos缺省的命名策略,重名后加1,2,3...如果不加dfp重名将覆盖
17. DefaultFileRenamePolicy dfp = new DefaultFileRenamePolicy();
18. //response的编码为"UTF-8",同时采用缺省的文件名冲突解决策略,实现上传,如果不加dfp重名将覆盖
19. MultipartRequest multi = new MultipartRequest(request, saveDirectory, maxPostSize,"UTF-8",dfp);
20. //MultipartRequest multi = new MultipartRequest(request, saveDirectory, maxPostSize,"UTF-8");
21. //输出反馈信息
22. files = multi.getFileNames();
23. while (files.hasMoreElements()) {
24. System.err.println("ccc");
25. name = (String)files.nextElement();
26. f = multi.getFile(name);
27. if(f!=null){
28. fileName = multi.getFilesystemName(name);
29. //获取上传文件的扩展名
30. extName=fileName.substring(fileName.lastIndexOf(".")+1);
31. //文件全路径
32. lastFileName= saveDirectory+"\\" + fileName;
33. //获取需要转换的文件名,将路径名中的'\'替换为'/'
34. converfilename = saveDirectory.replaceAll("\\\\", "/")+"/"+fileName;
35. System.out.println(converfilename);
36. //调用转换类DocConverter,并将需要转换的文件传递给该类的构造方法
37. d = new DocConverter(converfilename);
38. //调用conver方法开始转换,先执行doc2pdf()将office文件转换为pdf;再执行pdf2swf()将pdf转换为swf;
39. d.conver();
40. //调用getswfPath()方法,打印转换后的swf文件路径
41. System.out.println(d.getswfPath());
42. //生成swf相对路径,以便传递给flexpaper播放器
43. swfpath = "upload"+d.getswfPath().substring(d.getswfPath().lastIndexOf("/"));
44. System.out.println(swfpath);
45. //将相对路径放入sessio中保存
46. session.setAttribute("swfpath", swfpath);
47. out.println("上传的文件:"+lastFileName);
48. out.println("文件类型"+extName);
49. <hr>");
50. }
51. }
52.
53. %>
54. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
55. <html>
56. <head>
57. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
58. <title>Insert title here</title>
59. <style>
60. body {margin-top:100px;background:#fff;font-family: Verdana, Tahoma;}
61. a {color:#CE4614;}
62. #msg-box {color: #CE4614; font-size:0.9em;text-align:center;}
63. #msg-box .logo {border-bottom:5px solid #ECE5D9;margin-bottom:20px;padding-bottom:10px;}
64. #msg-box .title {font-size:1.4em;font-weight:bold;margin:0 0 30px 0;}
65. #msg-box .nav {margin-top:20px;}
66. </style>
67. </head>
68. <body>
69. <div>
70. <form name="viewForm" id="form_swf" action="documentView.jsp" method="POST">
71. <input type='submit' value='预览' class='BUTTON SUBMIT'/>
72. </form>
73. </div>
74. </body>
75. </html>
4.创建查看页documentView.jsp
1. <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
2. <%
3. swfFilePath=session.getAttribute("swfpath").toString();
4. %>
5. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
6. <html>
7. <head>
8. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
9. <script type="text/javascript" src="js/jquery.js"></script>
10. <script type="text/javascript" src="js/flexpaper_flash.js"></script>
11. <script type="text/javascript" src="js/flexpaper_flash_debug.js"></script>
12. <style type="text/css" media="screen">
13. html, body { height:100%; }
14. body { margin:0; padding:0; overflow:auto; }
15. #flashContent { display:none; }
16. </style>
17.
18. <title>文档在线预览系统</title>
19. </head>
20. <body>
21. <div style="position:absolute;left:50px;top:10px;">
22. <a id="viewerPlaceHolder" style="width:820px;height:650px;display:block"></a>
23.
24. <script type="text/javascript">
25. fp = new FlexPaperViewer(
26. 'FlexPaperViewer',
27. 'viewerPlaceHolder', { config : {
28. <%=swfFilePath%>'),
29. Scale : 0.6,
30. ZoomTransition : 'easeOut',
31. ZoomTime : 0.5,
32. ZoomInterval : 0.2,
33. FitPageOnLoad : true,
34. FitWidthOnLoad : false,
35. FullScreenAsMaxWindow : false,
36. ProgressiveLoading : false,
37. MinZoomSize : 0.2,
38. MaxZoomSize : 5,
39. SearchMatchAll : false,
40. InitViewMode : 'SinglePage',
41.
42. ViewModeToolsVisible : true,
43. ZoomToolsVisible : true,
44. NavToolsVisible : true,
45. CursorToolsVisible : true,
46. SearchToolsVisible : true,
47.
48. localeChain: 'en_US'
49. }});
50. </script>
51. </div>
52. </body>
53. </html>
5.创建转换类DocConverter.java
1. package com.cectsims.util;
2. import java.io.BufferedInputStream;
3. import java.io.File;
4. import java.io.IOException;
5. import java.io.InputStream;
6.
7. import com.artofsolving.jodconverter.DocumentConverter;
8. import com.artofsolving.jodconverter.openoffice.connection.OpenOfficeConnection;
9. import com.artofsolving.jodconverter.openoffice.connection.SocketOpenOfficeConnection;
10. import com.artofsolving.jodconverter.openoffice.converter.OpenOfficeDocumentConverter;
11.
12. /**
13. * doc docx格式转换
14. */
15. public class DocConverter {
16. private static final int environment = 1;// 环境 1:windows 2:linux
17. private String fileString;// (只涉及pdf2swf路径问题)
18. private String outputPath = "";// 输入路径 ,如果不设置就输出在默认的位置
19. private String fileName;
20. private File pdfFile;
21. private File swfFile;
22. private File docFile;
23.
24. public DocConverter(String fileString) {
25. ini(fileString);
26. }
27.
28. /**
29. * 重新设置file
30. *
31. * @param fileString
32. */
33. public void setFile(String fileString) {
34. ini(fileString);
35. }
36.
37. /**
38. * 初始化
39. *
40. * @param fileString
41. */
42. private void ini(String fileString) {
43. this.fileString = fileString;
44. 0, fileString.lastIndexOf("."));
45. new File(fileString);
46. new File(fileName + ".pdf");
47. new File(fileName + ".swf");
48. }
49.
50. /**
51. * 转为PDF
52. *
53. * @param file
54. */
55. private void doc2pdf() throws Exception {
56. if (docFile.exists()) {
57. if (!pdfFile.exists()) {
58. new SocketOpenOfficeConnection(8100);
59. try {
60. connection.connect();
61. new OpenOfficeDocumentConverter(connection);
62. converter.convert(docFile, pdfFile);
63. // close the connection
64. connection.disconnect();
65. "****pdf转换成功,PDF输出:" + pdfFile.getPath()+ "****");
66. catch (java.net.ConnectException e) {
67. e.printStackTrace();
68. "****swf转换器异常,openoffice服务未启动!****");
69. throw e;
70. catch (com.artofsolving.jodconverter.openoffice.connection.OpenOfficeException e) {
71. e.printStackTrace();
72. "****swf转换器异常,读取转换文件失败****");
73. throw e;
74. catch (Exception e) {
75. e.printStackTrace();
76. throw e;
77. }
78. else {
79. "****已经转换为pdf,不需要再进行转化****");
80. }
81. else {
82. "****swf转换器异常,需要转换的文档不存在,无法转换****");
83. }
84. }
85.
86. /**
87. * 转换成 swf
88. */
89. @SuppressWarnings("unused")
90. private void pdf2swf() throws Exception {
91. Runtime r = Runtime.getRuntime();
92. if (!swfFile.exists()) {
93. if (pdfFile.exists()) {
94. if (environment == 1) {// windows环境处理
95. try {
96. "D:/Program Files/SWFTools/pdf2swf.exe "+ pdfFile.getPath() + " -o "+ swfFile.getPath() + " -T 9");
97. System.out.print(loadStream(p.getInputStream()));
98. System.err.print(loadStream(p.getErrorStream()));
99. System.out.print(loadStream(p.getInputStream()));
100. "****swf转换成功,文件输出:"
101. "****");
102. if (pdfFile.exists()) {
103. pdfFile.delete();
104. }
105.
106. catch (IOException e) {
107. e.printStackTrace();
108. throw e;
109. }
110. else if (environment == 2) {// linux环境处理
111. try {
112. "pdf2swf " + pdfFile.getPath()
113. " -o " + swfFile.getPath() + " -T 9");
114. System.out.print(loadStream(p.getInputStream()));
115. System.err.print(loadStream(p.getErrorStream()));
116. "****swf转换成功,文件输出:"
117. "****");
118. if (pdfFile.exists()) {
119. pdfFile.delete();
120. }
121. catch (Exception e) {
122. e.printStackTrace();
123. throw e;
124. }
125. }
126. else {
127. "****pdf不存在,无法转换****");
128. }
129. else {
130. "****swf已经存在不需要转换****");
131. }
132. }
133.
134. static String loadStream(InputStream in) throws IOException {
135.
136. int ptr = 0;
137. new BufferedInputStream(in);
138. new StringBuffer();
139.
140. while ((ptr = in.read()) != -1) {
141. char) ptr);
142. }
143.
144. return buffer.toString();
145. }
146. /**
147. * 转换主方法
148. */
149. @SuppressWarnings("unused")
150. public boolean conver() {
151.
152. if (swfFile.exists()) {
153. "****swf转换器开始工作,该文件已经转换为swf****");
154. return true;
155. }
156.
157. if (environment == 1) {
158. "****swf转换器开始工作,当前设置运行环境windows****");
159. else {
160. "****swf转换器开始工作,当前设置运行环境linux****");
161. }
162. try {
163. doc2pdf();
164. pdf2swf();
165. catch (Exception e) {
166. e.printStackTrace();
167. return false;
168. }
169.
170. if (swfFile.exists()) {
171. return true;
172. else {
173. return false;
174. }
175. }
176.
177. /**
178. * 返回文件路径
179. *
180. * @param s
181. */
182. public String getswfPath() {
183. if (swfFile.exists()) {
184. String tempString = swfFile.getPath();
185. "\\\\", "/");
186. return tempString;
187. else {
188. return "";
189. }
190.
191. }
192. /**
193. * 设置输出路径
194. */
195. public void setOutputPath(String outputPath) {
196. this.outputPath = outputPath;
197. if (!outputPath.equals("")) {
198. "/"),
199. "."));
200. if (outputPath.charAt(outputPath.length()) == '/') {
201. new File(outputPath + realName + ".swf");
202. else {
203. new File(outputPath + realName + ".swf");
204. }
205. }
206. }
207.
208. }
6.部署发布
启动tomcat,部署当前web应用
地址栏输入http://localhost:8080/ctcesims/documentUpload.jsp 如下图:
单击选择文件,选择您要上传的文档,然后单击上传,处理完成后,打印如下信息,如下图所示:
单击预览按钮,就会生成预览界面,如下图:
4.常见问题
若出现swf无法预览,请访问
http://www.macromedia.com/support/documentation/en/flashplayer/help/settings_manager04a.html#119065
将生成swf的文件夹设置为信任文件位置。
2013-12-03 整理更新
bug:预览txt文档,txt转pdf,会出现乱码!
针对该问题,网上有不少解决方案,在此只提供自己测试好的一种解决方案:先将txt转换成odt文件,再将odt文件转换为pdf
1.修改DocConverter.java类中的初始化方法
1. /**
2. * 初始化
3. * @author lf
4. * @param fileString
5. */
6. private void ini(String fileString) {
7. try {
8. this.fileString = fileString;
9. 0, fileString.lastIndexOf("/"));
10. new File(fileString);
11. "/") + 1,fileString.lastIndexOf("."));
12. "/" + s;
13. // 用于处理TXT文档转化为PDF格式乱码,获取上传文件的名称(不需要后面的格式)
14. "."));
15. // 判断上传的文件是否是TXT文件
16. if (txtName.equalsIgnoreCase(".txt")) {
17. // 定义相应的ODT格式文件名称
18. new File(fileName + ".odt");
19. // 将上传的文档重新copy一份,并且修改为ODT格式,然后有ODT格式转化为PDF格式
20. this.copyFile(docFile, odtFile);
21. new File(fileName + ".pdf"); // 用于处理PDF文档
22. else if (txtName.equals(".pdf") || txtName.equals(".PDF")) {
23. new File(fileName + ".pdf");
24. this.copyFile(docFile, pdfFile);
25. else {
26. new File(fileName + ".pdf");
27. }
28. new File(fileName + ".swf");
29. catch (IOException e) {
30. e.printStackTrace();
31. }
32. }
ok!有问题请留言!
源码已上传,下载链接: