Swftools+FlexPaper实现PDF上传在线预览功能

Kai_Ge

浏览: 72876 次
性别:
来自: 济南

最近访客更多访客>>

zhangji531

andy_tm

zhouxiaojie521

watch_the_watch

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

技术实现

swftools FlexPaper 在线预览

最近项目需要在线预览功能，经过各方面的资料研究，可行的方案是swftools+FlexPaper，现把实现思路及碰到问题总结一下：

1、swftools-2013-04-09-1007.exe提供pdf转swf文件，供FlexPaper调用。

2、FlexPaper由开源变为商业化，新版本只提供前十页显示，购买后才能实现全功能，功能更强大，支持FLASH、HTML4、HTML5等模式，为免费实现在线预览功能，本项目在此使用此前的开源版本，但是自带水印，介意的化可考虑破解版，网上自寻。

3、本项目仅支持pdf上传预览，如扩展word上传，可考虑word转pdf在转swf。

4、FlexPaperViewer.swf和FlexPaperViewer.htm必须放在WebRoot根目录下才可以，这也是多次尝试之后得出的结论，网上的资料大致相同，但是根据步骤始终无法实现正常预览的原因。

5、服务器必须安装swftools，以保证上传文件时调用pdf转swf文件。

目录结构如下：

显示效果如下：

================华丽的分割线==========以下为代码==============

1、文件上传时调用：

// =================================PDF2SWF===============================================
			String uploadDir = request.getSession().getServletContext().getRealPath("/");
			String pdfPath = ""; 
			if (list.size() > 0) {
				for (int i = 0; i < list.size(); i++) {
					DicWsjsFj wj = new DicWsjsFj();
					wj.setMid(id);
					wj.setFjmc(list.get(i).get("name").toString());
					wj.setPath(list.get(i).get("newname").toString());
					wsjsDao.saveOrUpdateFj(wj);
					// =================================PDF2SWF===============================================
					pdfPath = uploadDir.substring(0, uploadDir.length()-1) + list.get(i).get("newname").toString().replace("/", "\\");
					PDF2SwfHelper.execPdfToSwf(pdfPath);
//					request.getSession().setAttribute("filePath", pdfPath);
				}
			}

2、PDF2SwfHelper.java

package com.zljy.oa.util;

import java.io.BufferedReader;
import java.io.IOException;
import java.io.InputStream;
import java.io.InputStreamReader;

public class PDF2SwfHelper {


	public static void execPdfToSwf(String pdfPath) {
		String SWFPath = PropUtil.getProperties("SWFPath");
		Process process = null;
		String cmd = "\"" + SWFPath + "\\pdf2swf.exe\" \"" + pdfPath + "\" -s flashversion=9 \"" + pdfPath + ".swf\"";
		System.out.println("cmd--->" + cmd);
		
		try {
			process = Runtime.getRuntime().exec(cmd);// 执行命令
			
			System.out.print(loadStream(process.getInputStream()));
			System.err.print(loadStream(process.getErrorStream()));
			System.out.print(loadStream(process.getInputStream()));
			int result = process.waitFor();
			if (result == 0) {
				try {
					// TODO:
				} catch (Exception e) {
					e.printStackTrace();
				}
			}
		} catch (IOException e) {
			e.printStackTrace();
		} catch (InterruptedException e) {
			e.printStackTrace();
		}
		System.out.println("cmd over!");
	}
	
	public static void main(String[] args){
		try {
			//System.out.println(Runtime.getRuntime().exec("cmd /c start c://swf.bat"));
			System.out.println("11");
		} catch (Exception e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
		execPdfToSwf("D:\\ActivitiTomcat\\webapps\\oa\\upload\\winPlan\\201503201530571522746426268764261.pdf");
	}
	
	private static String loadStream(InputStream in) throws IOException {
		int ptr = 0;
		// 把InputStream字节流 替换为BufferedReader字符流
		BufferedReader reader = new BufferedReader(new InputStreamReader(in));
		StringBuilder buffer = new StringBuilder();
		while ((ptr = reader.read()) != -1) {
			buffer.append((char) ptr);
		}
		return buffer.toString();
	}
}

3、前台页面

<a href="${pageContext.request.contextPath}/FlexPaperViewer.htm?filePath=${fn:substring(fj.path,1,fn:length(fj.path))}.swf">在线阅读（仅支持PDF格式）</a><br/>

4、 FlexPaperViewer.htm

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<!-- saved from url=(0014)about:internet --> 
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">	
    <head> 
        <title>在线阅读</title>         
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
        <style type="text/css" media="screen"> 
			html, body	{ height:100%; }
			body { margin:0; padding:0; overflow:auto; }   
			#flashContent { display:none; }
        </style> 
		
		<script type="text/javascript" src="js/swfobject/swfobject.js"></script> 
		<script type="text/javascript" src="js/flexpaper_flash_debug.js"></script> 
		<script type="text/javascript" src="js/jquery-1.8.0.min.js"></script> 
		
		<script type="text/javascript"> 
            <!-- For version detection, set to min. required Flash Player version, or 0 (or 0.0.0), for no version detection. --> 
            var swfVersionStr = "10.0.0";
            <!-- To use express install, set to playerProductInstall.swf, otherwise the empty string. -->
            var xiSwfUrlStr = "playerProductInstall.swf";
            var swfFile = getParameter("filePath");
            if(swfFile == ""){
            	swfFile = "flexPaper/Paper.swf";
            }
            var flashvars = { 
                  SwfFile : escape(swfFile),
				  Scale : 1.0, 
                  StartAtPage:1,
				  ZoomTransition : "easeOut",
				  ZoomTime : 0.5,
  				  ZoomInterval : 0.2,
  				  FitPageOnLoad : true,
  				  FitWidthOnLoad : false,
  				  PrintEnabled : true,
  				  FullScreenAsMaxWindow : false,
  				  ProgressiveLoading : true,
  				  
//  				  PrintToolsVisible : true,
//  				  ViewModeToolsVisible : true,
//  				  ZoomToolsVisible : true,
//  				  FullScreenVisible : true,
//  				  NavToolsVisible : true,
//  				  CursorToolsVisible : true,
//  				  SearchToolsVisible : true,
  				  
  				  localeChain: "en_US"
				  };
				  
			 var params = {};
            params.quality = "high";
            params.bgcolor = "#ffffff";
            params.allowscriptaccess = "sameDomain";
            params.allowfullscreen = "true";
            var attributes = {};
            attributes.id = "FlexPaperViewer";
            attributes.name = "FlexPaperViewer";
            swfobject.embedSWF(
                "FlexPaperViewer.swf", "flashContent", 
                "1024", "768",
                swfVersionStr, xiSwfUrlStr, 
                flashvars, params, attributes);
			swfobject.createCSS("#flashContent", "display:block;text-align:left;");
			
			function getParameter(param){
				var query = window.location.search;
				var iLen = param.length;
				var iStart = query.indexOf(param);
				if (iStart == -1)
				   return "";
				iStart += iLen + 1;
				var iEnd = query.indexOf("&", iStart);
				if (iEnd == -1)
				   return query.substring(iStart);
				return query.substring(iStart, iEnd);
			}
        </script> 
        
    </head> 
    <body> 
    	<div style="position:absolute;left:10px;top:10px;"> 
	        <div id="flashContent"> 
	        	<p> 
		        	To view this page ensure that Adobe Flash Player version 
					10.0.0 or greater is installed. 
				</p> 
				<script type="text/javascript">
				    var pageHost = ((document.location.protocol == "https:") ? "https://" : "http://");
				    document.write("<a href='http://www.adobe.com/go/getflashplayer'><img src='"
									+ pageHost + "www.adobe.com/images/shared/download_buttons/get_flash_player.gif' alt='Get Adobe Flash player' /></a>"); 
				</script> 
	        </div> 
        </div> 
        <!-- 
        <div style="position:absolute;left:750px;top:10px;font-family:Verdana;font-size:9pt;"> 
        <table border="0" width="230"> 
	        <tr><th colspan=3>Operations</th></tr> 
	        <tr><td>loadSwf</td><td><input type=text style="width:70px;" id="txt_swffile" value="Paper.swf"></td><td><input type=submit value="Invoke" onclick="getDocViewer().loadSwf($('#txt_swffile').val())"></td></tr> 
	        <tr><td>fitWidth</td><td></td><td><input type=submit value="Invoke" onclick="getDocViewer().fitWidth()"></td></tr> 
	        <tr><td>fitHeight</td><td></td><td><input type=submit value="Invoke" onclick="getDocViewer().fitHeight()"></td></tr> 
	        <tr><td>gotoPage</td><td><input type=text style="width:70px;" id="txt_pagenum" value="3"></td><td><input type=submit value="Invoke" onclick="getDocViewer().gotoPage($('#txt_pagenum').val())"></td></tr> 
	        <tr><td>getCurrPage</td><td></td><td><input type=submit value="Invoke" onclick="alert('Current page:' + getDocViewer().getCurrPage())"></td></tr> 
	        <tr><td>nextPage</td><td></td><td><input type=submit value="Invoke" onclick="getDocViewer().nextPage()"></td></tr> 
	        <tr><td>prevPage</td><td></td><td><input type=submit value="Invoke" onclick="getDocViewer().prevPage()"></td></tr> 
	        <tr><td>setZoom</td><td><input type=text style="width:70px;" id="txt_zoomfactor" value="1.30"></td><td><input type=submit value="Invoke" onclick="getDocViewer().setZoom($('#txt_zoomfactor').val())"></td></tr> 
	        <tr><td>searchText</td><td><input type=text style="width:70px;" id="txt_searchtext" value="text"></td><td><input type=submit value="Invoke" onclick="getDocViewer().searchText($('#txt_searchtext').val())"></td></tr> 
	        <tr><td>switchMode</td><td><input type=text style="width:70px;" id="txt_viewmode" value="Tile"></td><td><input type=submit value="Invoke" onclick="getDocViewer().switchMode($('#txt_viewmode').val())"></td></tr> 
	        <tr><td>printPaper</td><td></td><td><input type=submit value="Invoke" onclick="getDocViewer().printPaper()"></td></tr> 
        </table> 
        <br/><br/> 
        <table border="0" width="230"> 
        	<tr><th>Event Log</th></tr> 
        	<tr><td><textarea rows=6 cols=28 id="txt_eventlog" style="width:215px;"></textarea></td></tr> 
        	<tr><td><input type=text style="width:215px;" id="txt_progress" value=""></td></tr> 
	    </table> 
        </div> 
        -->
   </body> 
</html>

附：

1、FlexPaperDemo仅含前台例子

2、swftools-2013-04-09-1007安装文件

PS：文件10M限制，安装文件自行百度