首页 > 代码库 > 让你的PDF像百度文库一样在线预览

让你的PDF像百度文库一样在线预览

        上次写过一篇博客《巧用数据流让 Word 文档在线阅读》,其原理,主要就是把Word转成Html格式,然后通过数据流读取,并显示出来!发现一个问题,Word中有图片该怎么办?我们其实经常使用这样的工具,像豆丁网、百度文库等,他们是如何实现的呢?
        office文档在线预览大致有两种形式:
        1)使用Microsoft的Office组件将文件直接转换为html文件(优点:代码实现最简单,工作强度最小。缺点:效果极差),也就是上篇博客的效果。
        2)使用Microsoft的Office组件将文件转换为PDF格式文件,再使用插件转换为swf文件,然后flash文件通过另一个插件展示出来(优点:预览效果能接受,缺点:代码量大)。百度文库就是基于这种思路。

        将office文件转换为PDF格式文件,这个功能还未实现,一直报错。这篇博客暂且讲PDF的在线阅读吧,也就是使用把PDF文档转换为swf文件,然后使用再展示出来。


一、工具准备(工具我已经共享到百度云了,链接地址在文章末端):
        Pdf2swf:用于的把PDF格式文件,转换为swf文件

        Flexpaper:这是一个flash播放器,它可以播放一帧一页的flash。


二、代码实现
        1、Flexpaper的用法
        我们可以查看下载的Flexpape文件夹中index.html源代码,这里不多说,直接看它的用法吧:
        在前端的用法如下:
<!--首先要引入jquery库及相关的js-->
<script type="text/javascript" src=http://www.mamicode.com/"js/jquery.js"></script>>        html中的代码,只需声明一个a标签即可
<div style="position: absolute; left: 20px; top: 20px;">
    <a id="viewerPlaceHolder" style="width: 600px; height: 800px; display: block;"></a>
    <!--设置一个隐蔽控件来得到要显示的文件的名字-->
    <input type="hidden" id="file" value=http://www.mamicode.com/'' />>

        这样一来,基本上就可以在前端显示你的Flexpaper了.


        2.调用pdf2swf.exe把PDF转换为SWF的用法
        代码如下:
private static void ConvertCmd(string fileName)
{             
    using (Process p = new Process())
    {
        string cmdStr = HttpContext.Current.Server.MapPath("~/SWFTools/pdf2swf.exe");
        string savePath = HttpContext.Current.Server.MapPath("~/TestSWF/");
        // @"""" 相当于一个双引号,之所以要加@"""" 就是为了防止要转换的过程中,文件夹名字带有空格,导致失败
        string sourcePath = @"""" + savePath + fileName + @"""";
        string targetPath = @"""" + savePath + fileName.Substring(0, fileName.LastIndexOf(".")) + ".swf" + @"""";
        string argsStr = "  -t " + sourcePath + " -s flashversion=9 -o " + targetPath;
        //调用新进程 进行转换
        ProcessStartInfo psi = new ProcessStartInfo(cmdStr, argsStr);
        p.StartInfo = psi;
        p.Start();
        p.WaitForExit();
    }
}
        其中,我把pdf文件存放在~/TextSWF/文件夹下,转换后的swf也是存放在同一文件夹下了。按照以上的做法,应该没什么问题,就可以做出类似于百度文库的效果了。


三、最后看一下效果:


图1-PDF上传界面


图2-转成的Flash预览效果


        是不是很帅气?可惜,至今没弄成功office文档转成PDF,要不效果更完美,可以与百度文库相媲美了。革命尚未成功,继续折腾,看我下篇博客的成效吧!


工具链接地址链接:http://pan.baidu.com/s/1qWqKfnQ

让你的PDF像百度文库一样在线预览