由于pdf.js的浏览器兼容性不是特别好。所以考虑折中解决方案。将pdf转为swf 再在浏览器中显示swf. pdf转swf的工具参考 http://blog.csdn.net/xraydog/article/details/44015981

swf在浏览器中的展示考虑用flexpaper

在 flexpaper的官网上下载flexpaer 将flexpaper.css 复制到项目的css文件夹中 并在jsp中引入

在js文件夹中置入 expressInstall.swf  flexpaper_handlers_debug.js flexpaper_handlers.js flexpaper.js jquery.min.js 并在jsp中引入

在工程网页的根目录下创建 viewSWF.jsp 并将FlexPaperViewer.swf放置于网页的根目录中

viewSWF.jsp代码如下

<%@ taglib uri="http://java.sun.com/portlet_2_0" prefix="portlet"%>

<%@ include file="/init.jsp"%>
<%@ page pageEncoding="utf-8" contentType="text/html"%>
<link rel="stylesheet" type="text/css" href="./css/flexpaper.css" />
    <script type="text/javascript" src="./js/jquery.min.js"></script>
    <script type="text/javascript" src="./js/flexpaper.js"></script>
    <script type="text/javascript" src="./js/flexpaper_handlers.js"></script>
<div style="position:absolute;left:10px;top:10px;">
<div id="documentViewer" class="flexpaper_viewer" style="width:100%;height:100%"></div>
</div>
<script type="text/javascript">
	$('#documentViewer').css("width",document.body.clientWidth*0.98 + "px");
	$('#documentViewer').css("height",document.body.clientHeight*0.98 + "px");
    function getDocumentUrl(document){
        return "php/services/view.php?doc={doc}&format={format}&page={page}".replace("{doc}",document);
    }
    var src1 = "http://localhost:8080/swfs/a.swf";//替换为你对应的swf文件的地址
	var startDocument = "Paper";

    $('#documentViewer').FlexPaperViewer(
            { config : {

                SWFFile : src1,

                Scale : 0.6,
                ZoomTransition : 'easeOut',
                ZoomTime : 0.5,
                ZoomInterval : 0.2,
                FitPageOnLoad : true,
                FitWidthOnLoad : true,
                FullScreenAsMaxWindow : true,
                ProgressiveLoading : false,
                PrintEnabled: 'False',
                PrintToolsVisible: 'False',
                MinZoomSize : 0.2,
                MaxZoomSize : 5,
                SearchMatchAll : false,
                InitViewMode : 'Portrait',
                RenderingOrder : 'flash',
                StartAtPage : '',

                ViewModeToolsVisible : true,
                ZoomToolsVisible : true,
                NavToolsVisible : true,
                CursorToolsVisible : true,
                SearchToolsVisible : true,
                WMode : 'window',
                localeChain: 'zh_CN'
            }}
    );
</script>


<script type="text/javascript">
    var url = window.location.href.toString();

    if(location.length==0){
        url = document.URL.toString();
    }

    if(url.indexOf("file:")>=0){
        jQuery('#documentViewer').html("<div style='position:relative;background-color:#ffffff;width:420px;font-family:Verdana;font-size:10pt;left:22%;top:20%;padding: 10px 10px 10px 10px;border-style:solid;border-width:5px;'><img src='http://flexpaper.devaldi.com/resources/warning_icon.gif'> <b>You are trying to use FlexPaper from a local directory.</b><br/><br/> FlexPaper needs to be copied to a web server before the viewer can display its document properlty.<br/><br/>Please copy the FlexPaper files to a web server and access the viewer through a http:// url.</div>");
    }
</script>