DotImage创建Atalasoft Web文档查看器

本文主要介绍如何利用.NET图像处理开发包DotImage创建一个包含了嵌入式Web文档查看器的Web页面以及如何在Web页面中显示初始文件。

创建项目

在VS中，通过ASP.NET Empty Web Site 模板创建一个网页。随即，打开项目的属性页，设置必要的参数和项目。需要注意以下两点：

1. 在 References 菜单中，添加一个新的引用到Atalasoft DotImage WebControls (.NET 2.0)。DotImage 10.0提供了该WebControls，在你安装DotImage 10.3.1后，依赖自动包含在项目中

2. 在Build菜单中，将框架改为.NET Framework 3.5，然后重新打开项目，并迁移web.config。

新增项目资源

项目需要Web文档查看器资源的副本文件，包括客户端JavaScript和样式。DotImage 10.0自带该资源，默认情况下位于: C:\Program Files (x86)\Atalasoft\DotImage 10.0\bin\2.0\x86\WebResources\WebDocViewer。

将WebDocViewer 目录复制到项目根目录。

此外，我们还将创建一个默认的位置用于储存查看器中显示的图片。在项目的根目录下创建一个Images目录，然后将所选择的图像或文件添加到该目录下。本文以Example.tif图像为例。

添加Handler

连接文档查看器与网站上的独立处理器。

在项目中新增一个Generic Handler，文件名假设为WebDocViewer.ashx。Visual Studio中新增一个Web处理器的默认实现方式。用下列代码替换掉文件的全部内容：

<%@ WebHandler Language="C#" Class="WebDocViewerHandler" %>

 using System;
 using System.Web;
 using Atalasoft.Imaging.WebControls;

 public class WebDocViewerHandler : WebDocumentRequestHandler
 {
 }

添加网页

假设我们在本文中添加网页为Default.aspx. Visual Studio将会为该文件
 自动创建这个名为Default.aspx.cs中的代码隐藏。

Web文档查看器需要3块代码分别用于加载资源，创建显示区域以及初始化该区域。

在文档的顶部添加下列HTML代码，从而加载所需资源以创建Web文档查看器对象。

<script src="WebDocViewer/jquery-1.6.1.min.js" type="text/javascript"></script>
 <script src="WebDocViewer/jquery.easing.1.3.js" type="text/javascript"></script>
 <script src="WebDocViewer/jquery-ui-1.8.14.custom.min.js" type="text/javascript"></script>
 <script src="WebDocViewer/atalaWebDocumentViewer.js" type="text/javascript"></script>
 <link href="WebDocViewer/atalaWebDocumentViewer.css" rel="Stylesheet" type="text/css" />

接下来，在文档的body中添加下列HTML代码，从而创建文档显示区域。你可以自定义DIV标签。在本示例中，页面的高度和宽度受到限制。

<div id="_toolbar1" class="atala-document-toolbar" style="width: 670px;"></div>
 <div id="_container1" class="atala-document-container" style="width: 670px; height: 500px;"></div>

最后，下列JavaScript代码可初始化查看器。构造函数接受影响查看器行为和初始状态的所有配置。最低配置将提示何处应该创建查看器，何处应该放置Web处理器以及最初应显示何种图像。

<script type="text/javascript" language="javascript">
 var _docUrl = 'Images/Example.tif';
 var _serverUrl = 'WebDocViewer.ashx';

 var _viewer = new Atalasoft.Controls.WebDocumentViewer({
 'parent': $('#_container1'),        // parent container to put the viewer in
 'toolbarparent': $('#_toolbar1'),   // parent container to put the viewer toolbar in
 'serverurl': _serverUrl,            // server handler url to send p_w_picpath requests to
 'documenturl': _docUrl              // document url relative to the server handler url
 });
 </script>

部署到IIS

此时此刻，网站已准备就绪。如果您要部署到IIS，需要注意一下几点：

• 将项目复制到IIS文档根目录下。

• 获取DotImage服务器授权，将授权文件置于项目的Bin目录。

• 在IIS Manager中，将你的项目目录转换到应用程序，并将其分配到Application Pool。

• 检查所使用Application Pool的设置，确定Enable 32-Bit Applications设置为“True”，Managed Pipeline Mode设置为Classic。

此时，你便可以在浏览器中查看你的所加载的文件。