Let your PDF be previewed online like Baidu Library

Source: Internet
Author: User
I wrote a blog titled skillfully using data streams to read Word documents online. The principle is to convert Word into HTML format and then read and display it through data streams! What should I do if I find an image in word? In fact, we often use such tools, such as douding and Baidu Library. How do they implement them?
There are two ways to preview office documents online:
1) use Microsoft Office components to directly convert files to HTML files (advantage: the code implementation is the simplest and the work intensity is the smallest. Disadvantage: poor performance), that is, the effect of the previous blog.
2) use the Microsoft Office component to convert a file to a PDF file, then use the plug-in to convert it to a SWF file, and then display the Flash file through another plug-in (advantage: the preview effect is acceptable, disadvantage: large amount of code ). Baidu Library is based on this idea.

Converting an office file to a PDF file is not implemented yet and an error is reported. This blog will talk about online reading of PDF files for the moment, that is, converting PDF files into SWF files and then displaying them.


I. Prepare the tool(I have shared the tool with Baidu cloud, and the link is at the end of the article ):
Ipv2swf: used to convert a PDF file to a SWF file.

Flexpaper: A flash player that can play a single page of flash.


Ii. Code Implementation
1. flexpaper usage
We can download the index.html source code from the flexpapefolder. Let's just look at its usage:
The usage of the front end is as follows:
<! -- First introduce the jquery library and related JS --> <SCRIPT type = "text/JavaScript" src = "JS/jquery. JS "> </SCRIPT> <SCRIPT type =" text/JavaScript "src =" JS/flexpaper_flash.js "> </SCRIPT> <SCRIPT type =" text/JavaScript "src =" JS/flexpaper_flash_debug.js "> </SCRIPT>
Only one a tag can be declared for the code in HTML.
<Div style = "position: absolute; left: 20px; top: 20px;"> <a id = "viewerplaceholder" style = "width: 600px; Height: 800px; display: block; "> </a> <! -- Set a hidden control to get the name of the file to be displayed --> <input type = "hidden" id = "file" value = '<% = fileurl %>'/> <script Type = "text/JavaScript"> var fileurl = $ ("# file "). val (); var fp = new flexpaperviewer ('flexpaper/flexpaperviewer ', 'viewerplaceholder', {config: {swffile: escape ('testswf/' + fileurl), scale: 0.6, expiration: 'easeout', zoomtime: 0.5, zoominterval: 0.2, fitpageonload: false, fitwidthonload: false, printenabled: True, success: false, success: false, minzoomsize: 0.2, maxzoomsize: 5, searchmatchall: false, initviewmode: 'portrait', viewmod=lsvisible: True, zoomtoolsvisible: True, navtoolsvisible: True, cursortoolsvisible: True, searchtoolsvisible: True, localechain: 'en _ us' }}); </SCRIPT> </div>

In this way, you can display your flexpaper on the front end.


2.use pdf2swf.exe to convert a PDF file to a SWF File
The Code is as follows:
Private Static void convertcmd (string filename) {using (PROCESS p = new process () {string destination STR = httpcontext. Current. server. mappath ("~ /Swftools/ipv2swf.exe "); string savepath = httpcontext. Current. server. mappath ("~ /Testswf/"); // @" is equivalent to a double quotation mark. The reason why @ "is added is to prevent folder names from being converted with spaces, cause failure string sourcepath = @ "+ savepath + filename + @"; string targetpath = @ "+ savepath + filename. substring (0, filename. lastindexof (". ") + ". SWF "+ @"; string argsstr = "-T" + sourcepath + "-S flashversion = 9-o" + targetpath; // call the new process to convert processstartinfo psi = new processstartinfo (writable STR, argsstr); p. startinfo = PSI; p. start (); p. waitforexit ();}}
Here, I store the PDF file in ~ In the/textswf/folder, the converted SWF is also stored in the same folder. According to the above practice, there should be no problem, so we can make the effect similar to that of Baidu Library.


Iii. Finally, let's take a look at the effect:


Figure 1-PDF upload page


Figure 2-converted flash Preview


Is it handsome? Unfortunately, the Office document has not been successfully converted into a PDF file so far. If the effect is more perfect, it can be comparable to that of Baidu Library. The revolution has not yet succeeded. Let's continue to work hard. Let's take a look at the effectiveness of my next blog!


Tool link: http://pan.baidu.com/s/1qWqKfnQ

Let your PDF be previewed online like Baidu Library

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.