关于PDF在线阅读问题，比较普遍的做法是转换成swf文件来浏览；由于项目需要，就用 flexpaper 来实现了下，功能比较简单；但是文件的惰性加载确实让笔者挠头了一把！

下面是笔者的方法： 采用流的方式来读取每一页的swf文件，然后展示（pdf转换成多个swf文件网上一大把）；亲自测试，100M的pdf文档，转换后在线浏览，延迟不超过1s;

JSP页面 :

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<%

String path = request.getContextPath();

String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

%>



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

  <head>

    <base href="<%=basePath%>">

    <title>在线阅读</title>

    <style>

    	.box{

    		width: 99%;

			height: 500px;

			border: 1px solid #CCC;

			margin: 10px auto;

    	}

    </style>

	<script type="text/javascript" src="<%=basePath%>common/js/jquery-1.7.min.js"></script>

	<script type="text/javascript" src="<%=basePath%>common/js/flexpaper/flexpaper_flash.js" ></script>

	<script type="text/javascript" src="<%=basePath%>common/js/pdf2swf.js" ></script>

	<script>

		var basePath = "<%=basePath%>";

//		var bh = "${zy.id}";//资源编号

//		var nwpg = "${nowPg}";//资源当前页数

		var bh = "0020150929000008"; //测试用的资源编号（也是物理文件名称）

		var nwpg = "1";//默认从第一页开始加载

		$(function(){

			var url = null;

			url = basePath+"flexpaper?bh="+bh+nwpg+"{[*,0],100}";

			pdf2swf(url);

		});

	</script>

  </head>

<body>

		<div class="box" >

			<div id="viewerPlaceHolder" style="width:100%;height:100%;display:block"></div>

		</div>

</body>

</html>

JAVA后台代码：

package com.zwc.servlet;

import java.io.BufferedOutputStream;

import java.io.File;

import java.io.FileInputStream;

import java.io.IOException;

import java.io.OutputStream;

import javax.servlet.ServletException;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

public class FlexPaperServlet extends HttpServlet {

    public void doGet(HttpServletRequest request, HttpServletResponse response)

            throws ServletException, IOException {

            doPost(request,response);

    }

    public void doPost(HttpServletRequest request, HttpServletResponse response)

            throws ServletException, IOException {

        String bh = request.getParameter("bh");//该bh为 bh+ nwpg；资源编号+当前页数

        String path= bh+".swf";

        String swfdir = "D:/data/zypt/swf/";//获得文件夹路径

        File f = new File(swfdir+path);//拿到当前页面文件

        FileInputStream fis = null;

        OutputStream out = null ;

        try {

            response.setContentType("application/x-shockwave-flash");

            response.setHeader("Accept-Ranges", "bytes");

            fis = new FileInputStream(f) ;

            out = new BufferedOutputStream(response.getOutputStream());

            byte[] bytes = new byte[(int) f.length()];

            response.setContentLength(bytes.length);

            fis.read(bytes) ;

            fis.close() ;

            out.write(bytes) ;

            out.flush() ;

        }catch (Exception e) {

        }finally{

            if(null != out){

                out.close();

            }

        }

    }

}

WEB.xml文件Servlet配置:

<?xml version="1.0" encoding="UTF-8"?>

<web-app version="2.5"

    xmlns="http://java.sun.com/xml/ns/javaee"

    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"

    xsi:schemaLocation="http://java.sun.com/xml/ns/javaee

    http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">

  <display-name></display-name>

  <servlet>

    <description>This is the description of my J2EE component</description>

    <display-name>This is the display name of my J2EE component</display-name>

    <servlet-name>FlexPaperServlet</servlet-name>

    <servlet-class>com.zwc.servlet.FlexPaperServlet</servlet-class>

  </servlet>

  <servlet-mapping>

    <servlet-name>FlexPaperServlet</servlet-name>

    <url-pattern>/flexpaper</url-pattern>

  </servlet-mapping>

  <welcome-file-list>

    <welcome-file>index.jsp</welcome-file>

  </welcome-file-list>

</web-app>

pdf2swf.js代码：

function pdf2swf(url){

    var p = new FlexPaperViewer(

             basePath+'common/js/flexpaper/FlexPaperViewer',

             'viewerPlaceHolder',

             {config :

                 {

                     SwfFile:encodeURI(url),

                     Scale :1.0,

                     ZoomTransition : 'easeOut',

                     ZoomTime : 0.5,

                     ZoomInterval : 0.2,

                     FitPageOnLoad : false,

                     FitWidthOnLoad : false,

                     FullScreenAsMaxWindow : true,

                     ProgressiveLoading : true,

                     MinZoomSize : 0.2,

                     MaxZoomSize : 5,

                     SearchMatchAll : false,

                     StartAtPage : nwpg,

                     InitViewMode : 'Portrait',

                     ViewModeToolsVisible : true,

                     ZoomToolsVisible : true,

                     NavToolsVisible : true,

                     CursorToolsVisible : true,

                     SearchToolsVisible : true,

//                     localeChain: 'en_US'

                     localeChain: 'zh_CN',

                 }

               }

             );

}

jsp所需js文件：

　　<script type="text/javascript" src="<%=basePath%>common/js/jquery-1.7.min.js"></script>
    <script type="text/javascript" src="<%=basePath%>common/js/flexpaper/flexpaper_flash.js" ></script>
    <script type="text/javascript" src="<%=basePath%>common/js/pdf2swf.js" ></script>

源码：下载 ；暂时只支持文档类型（不包括txt）,视频没来得及整理，中文名称文件暂时有点问题凑活看吧！

PDF在线阅读 FlexPaper 惰性加载 ；的更多相关文章

  1. web版pdf在线阅读器

    近期论坛里有人提到了,在线pdf阅读器怎么做.我百度了一下,发现非常多人都非常懒.程序猿都非常懒吗? 答案是否定的. 为什么都不愿意去搜索一下呢.网上非常多答案的.我这里就列举一例.大家共勉. 看代码 ...

  2. Angular2 ng2 如何配置惰性加载

    需要修改至少四个地方1. 将子组件进行模块化操作2.生成子组件module .子组件router3.配置主路由 信息 改为loadChild4.配置appModule 删除引入 以product组件 ...

  3. 雷林鹏分享：jQuery EasyUI 树形菜单 - 树形网格惰性加载节点

    jQuery EasyUI 树形菜单 - 树形网格惰性加载节点 有时我们已经得到充分的分层树形网格(TreeGrid)的数据. 我们还想让树形网格(TreeGrid)按层次惰性加载节点. 首先,只加载 ...

  4. angular惰性加载拓展剖析

    最近把一个比较旧的业余项目重新升级了下,将主文件进行了剥离,增加了些惰性加载的配置,将过程中一些零散的知识点做个总结,同时尽量深入原理实现层面. 项目环境: 前端框架:angular2.0.0-bet ...

  5. 关于angular5的惰性加载报错问题

    之前为了测试一个模块优化问题,于是用angular-cli快速搭建了个ng5的脚手架demo,在应用惰性加载功能的时候发现浏览器报错如下: ERROR Error: Uncaught (in prom ...

  6. Angular惰性加载的特性模块

    一:Angular-CLI建立应用 cmd命令:ng new lazy-app --routing    (创建一个名叫 lazy-app 的应用,而 --routing 标识生成了一个名叫 app- ...

  7. Django惰性加载和LazyObject

    看登录中间件的时候发现request.user返回的是SimpleOject对象,往下看翻到了LazyObject,看源码看了半天没看懂 网上搜了一堆资料了解下惰性加载实现是的什么功能,再回去看源码, ...

  8. javascript 性能惰性加载2016.12.13

    利用函数的惰性载入提高 javascript 代码性能 原文:利用函数的惰性载入提高javascript代码性能 作者:阿安 在 javascript 代码中,因为各浏览器之间的行为的差异,我们经常会 ...

  9. Android开发问题积累 <加载在线Gif><WebView无法加载网页图片>

    在线Gif加载 解决办法 Glide完美解决 Glide.with(context).load(pic).placeholder(R.drawable.loading).into(imageView) ...

随机推荐

  1. Enumerable和yield

    说说IEnumerable和yield IEnumerable数据类型是我比较喜欢的数据类型,特别是其强类型IEnumerable<T>更获得Linq的支持使得代码看起来更加优雅.整洁. ...

  2. 10.26最后的模拟DAY2 数字对[暴力]

    数字对 [题目描述] 小H是个善于思考的学生,现在她又在思考一个有关序列的问题. 她的面前浮现出一个长度为n的序列{ai},她想找出一段区间[L, R](1 <= L <= R <= ...

  3. 类图class的关联关系（聚合、组合）

    类图class的关联关系(聚合.组合) 关联的概念 关联用来表示两个或多个类的对象之间的结构关系,它在代码中表现为一个类以属性的形式包含对另一个类的一个或多个对象的应用. 程序演示:关联关系(code ...

  4. 大数据时代，我们为什么使用hadoop

    大数据时代,我们为什么使用hadoop 我们先来看看大数据时代, 什么叫大数据,“大”,说的并不仅是数据的“多”!不能用数据到了多少TB ,多少PB 来说. 对于大数据,可以用四个词来表示:大量,多样 ...

  5. [转]How WebKit Loads a Web Page

    ref:https://www.webkit.org/blog/1188/how-webkit-loads-a-web-page/ Before WebKit can render a web pag ...

  6. Linux 中 crontab 详解及示例

    cron是一个linux下的定时执行工具,可以在无需人工干预的情况下运行作业.由于Cron 是Linux的内置服务,但它不自动起来,可以用以下的方法启动.关闭这个服务: /sbin/service c ...

  7. 自用类库整理之SqlHelper和MySqlHelper

    自用类库整理之SqlHelper和MySqlHelper 自用的SQLHelper和MySqlHelper,除一些通用方法外,封装了一些很实用的批量操作方法,简单介绍下 SqlHelper Execu ...

  8. 转--htaccess语法教程 apache服务器伪静态规则教程

    转自:http://blog.csdn.net/qingli518/article/details/9118361 htaccess语法教程apache服务器伪静态规则教程 注:如果你是为了找Disc ...

  9. windows下配置PHP+Nginx+MySQL完整流程(转)

    对于在windows上的php+nginx的配置可能好多同学一次根本都配不正确,于我也是如此,为此我将我成功配置的过程细致的总结如下,希望能帮助搞PHP研究的同学 1.资源准备 MySQL:这个链接不 ...

  10. 使用WPF教你一步一步实现连连看

    使用WPF教你一步一步实现连连看(一) 第一步: 问题,怎样动态的建立一个10*10的grid(布局) for (int i = 0; i < 10; i++){ RowDefinition r ...