ASP.NET 用 FlexPaper 在页面上显示 PDF 文件
其实,虽说是显示 PDF 文件,但只是将 PDF 文件转换成 SWF,再用 Adobe Flash 插件播放。 另外,如果是 Word 文档,那么客户可以先利用 Office 插件或其他三方工具将 Word 文档转换成 PDF,再上传,也可以利用 Office COM 组件编写代码,将客户上传的 Word 文档直接转换成 PDF 文件。网上有很多这样的资料。 必要条件
演示 ASP.NET 用 FlexPaper 在页面上显示 PDF 文件软件环境
解决方案结构
简单显示 SWF 文件<%@ Page Language="C#" AutoEventWireup="true" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title> <script src="FlexPaper/js/jquery.js" type="text/javascript"></script> <script src="FlexPaper/js/flexpaper_flash.js" type="text/javascript"></script> <script runat="server">
public string FileURL { get; set; } protected void Page_Load(object sender, EventArgs e) { FileURL = "Paper.swf";
} </script> </head> <body> <form id="form1" runat="server"> <div style="position: absolute; left: 20px; top: 20px;">
<a id="viewerPlaceHolder" style="width: 600px; height: 500px; display: block;"></a> <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, ZoomTransition: 'easeOut',
ZoomTime: 0.5, ZoomInterval: 0.2, FitPageOnLoad: false,
FitWidthOnLoad: false,
PrintEnabled: true,
FullScreenAsMaxWindow: false,
ProgressiveLoading: false,
MinZoomSize: 0.2, MaxZoomSize: 5, SearchMatchAll: false,
InitViewMode: 'Portrait',
ViewModeToolsVisible: true,
ZoomToolsVisible: true,
NavToolsVisible: true,
CursorToolsVisible: true,
SearchToolsVisible: true,
localeChain: 'en_US'
} } ); </script> </div> </form> </body> </html> Paper.swf 是官方给的文件,运行结果如下图所示: 上传并显示 PDF 文件前台代码,如下所示: <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="PDFUploadViewer.aspx.cs"
Inherits="FlexPaper.PDFViewer.PDFUploadViewer" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> </head> <body> <form id="form1" runat="server"> <div style="margin: 50px auto; border: #e3e3e3 1px solid; height: 300px; width: 350px;> background-color: #8ABAE3; padding: 20px 20px 20px 20px;" <asp:FileUpload ID="FileUpload1" runat="server" /> <br /> <br /> <asp:Button ID="Btn_Upload" runat="server" Text="上传" OnClick="Btn_Upload_Click" /> <br /> <br /> 选择列表框中的文件,查看: <br /> <asp:ListBox ID="ListBox1" runat="server" Height="205px" Width="290px"></asp:ListBox> <asp:Button ID="Btn_Viewer" runat="server" Text="查看" OnClick="Btn_Viewer_Click" /> <br /> <br /> </div> </form> </body> </html> 后台代码,如下所示: using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Diagnostics;
namespace FlexPaper.PDFViewer
{ public partial class PDFUploadViewer : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { } /// <summary>
/// 上传 PDF,并转换成 SWF
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void Btn_Upload_Click(object sender, EventArgs e) { if (FileUpload1.HasFile)
{ try
{ string fileName = FileUpload1.FileName;
string fileExtention = FileUpload1.FileName.Substring(fileName.LastIndexOf(".") + 1); string filePath = HttpContext.Current.Server.MapPath("~/TestSWF\\") + fileName;", "<script>alert('上传成功')</script>");~/SWFTools/pdf2swf.exe");~/TestSWF/");""" + savePath + fileName + @"""";""" + savePath + fileName.Substring(0, fileName.LastIndexOf(".")) + ".swf" + @"""";""" 四个双引号得到一个双引号,如果你所存放的文件所在文件夹名有空格的话,要在文件名的路径前后加上双引号,才能够成功 -t " + sourcePath + " -s flashversion=9 -o " + targetPath;.")) +.swf", fileName.Substring(0, fileName.LastIndexOf(".")) + ".swf"));cmd">命令</param>args">命令参数</param>\"", "")); FileUpload1.SaveAs(filePath); Page.ClientScript.RegisterStartupScript(this.GetType(), " //切记,使用pdf2swf.exe 打开的文件名之间不能有空格,否则会失败 string cmdStr = HttpContext.Current.Server.MapPath(" string savePath = HttpContext.Current.Server.MapPath(" string sourcePath = @" string targetPath = @" //@" // -t 源文件的路径 // -s 参数化(也就是为pdf2swf.exe 执行添加一些窗外的参数(可省略)) string argsStr = " ExcutedCmd(cmdStr, argsStr); ListBox1.Items.Add(new ListItem(fileName.Substring(0, fileName.LastIndexOf(" " } catch { } } } /// <summary> /// 转换成 SWF 文件 /// </summary> /// <param name=" /// <param name=" private static void ExcutedCmd(string cmd, string args) { using (Process p = new Process()) { ProcessStartInfo psi = new ProcessStartInfo(cmd, args.Replace(" p.StartInfo = psi; p.Start(); p.WaitForExit(); } } /// <summary>
///
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void Btn_Viewer_Click(object sender, EventArgs e) { string url = "Viewer.aspx?id=" + HttpUtility.HtmlEncode(ListBox1.SelectedValue); string script = @" + url + <script>window.open('" "','newwindow','height=600,width=700,top=0,left=0,toolbar=no,menubar=no,scrollbars=no, resizable=yes,location=no, status=no');</script>";
Page.ClientScript.RegisterStartupScript(this.GetType(), "", script); } } } 上传 PDF 文档,并在后台转换成 SWF 文件,以便在页面上显示 上传后显示
常见问题
如果连 Flexpaper 都无法显示,并显示如下界面,说明你还没安装 Adobe Flash 插件。
如果官方的 Paper.swf 都不能加载成功,并显示,右上角的加载装载状态一直是等待状态,如下图: 这是由于 Flexpaper 还没获得 Adobe Flash 插件信任,点击 http://www.macromedia.com/support/documentation/en/flashplayer/help/settings_manager04a.html#119065 为 FlexPaper 添加信任。点击第三个 Tab 页“全局安全设置(Global Security Settings )”,如下图所示: 添加信任的 SWF 文件或其目录。此时就可以正常实现。
这可能是 .swf 文件的版本问题。可以运行 SWFTools 图形工具,尝试把 PDF 转换为 SWF,用程序加载显示,看看什么命令行参数好使。
参考资料 |