关于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. c#中queue的用法

    Queue队列就是先进先出.它并没有实现 IList,ICollection.所以它不能按索引访问元素,不能使用Add和Remove.下面是 Queue的一些方法和属性 Enqueue():在队列的末 ...

  2. Unkown2

    续上个unkown,这里mark一下,接下来觉得还有可能考到,且自己不会的东西(或不太会) 数学方面: 随机化,概率,简单的几何计算,杂七杂八的数论,组合数学中的差分,康托展开,高斯消元,线性规划 树 ...

  3. C#线程池用法

    C#线程池用法 在C#编程语言中,使用线程池可以并行地处理工作,当强制线程和更新进度条时,会使用内建架构的ThreadPool类,为批处理使用多核结构,这里我们来看在C#编程语言中一些关于来自Syst ...

  4. Lak3 Counting(POJ No.2386)

    问题描述: 有个大小为N*M的园子,雨后积起了水.八连通的积水被认为是连接在一起的.求出园子里总共有多少水洼. N, M <= 100 输入例: : 问题分析: 八连通即:上.左上.左,左下,下 ...

  5. Asp.net mvc 大文件上传 断点续传

    Asp.net mvc 大文件上传 断点续传 进度条   概述 项目中需要一个上传200M-500M的文件大小的功能,需要断点续传.上传性能稳定.突破asp.net上传限制.一开始看到51CTO上的这 ...

  6. 【hanoi】hanoi移动次数和移动步骤

    #include<stdio.h> #include<stdlib.h> //移动次数 int hanoi(int num) { ; ) { ; } else { all = ...

  7. CKeditor 集成 CKFinder

    之前照着网上的做,遇到了一些问题,经过多次实验修改最后算是成功了,下面进行详细讲解. 一.CKeditor的配置(附件中已有最新版CKeditor和CKFinder) 1.需要下载ckeditor, ...

  8. ios开发屏幕问题

    1. 程序要要支持Iphone 和 ipad,所以首先必需创建一通用程序,这一操作只要在创建程序时在 devices那栏上勾选universal即可,完成后会发现有两个.xib文件,但只有一个view ...

  9. 开发框架(WinForm)3

    我的开发框架(WinForm)3 今天继续给大家介绍核心库的IOC的使用,在我的框架里,IOC使用的比较简单,主要是用于解除模块间的耦合和实例化接口. 1.接口说明,IocContainer接口比较简 ...

  10. JQUERY UI DOWNLOAD

    JQUERY UI DOWNLOAD jDownload是jQuery的一个下载插件,用户可以在下载文件之前知道文件的详细信息,在提高用户体验度方面起到了很大的作用. 鉴于官网的Demo是通过PHP文 ...