کار با Group Doc Viewer

در این مقاله قصد داریم به معرفی برخی ویژگی های asp.net document viewver  بپردازیم ابزاری که به شما این امکان را میدهد تا تا بیش از 50 نوع سند مانند اکسل، pdf,  word, power pointرا در صفحات وب خود بتوانید نمایش دهید.

تمامی میان افزارهایی که بر پابه وب کار میکنند و برای نمایش مستندات مختلف استفاده میشوند به دو گروه تقسیم میشوند: میان افزارهای سمت کلاینت و میان افزارهای کلاینت سروری.

نمایش دهنده های دسته اول عملیات نمایش سند را بر روی دستگاه مقصد انجام میدهند انها سند را از سرور بر روی کلاینت دانلود میکنند و در مرورگر نمایش میدهند. این گروه از نمایش دهنده های سند با استفاده از برنامه هایی مانند اپلت جاوا، ادوبی فلش، مایکروسافت سیلورلایت و یا فن آوری های سمت سرویس گیرنده مشابه ساخته شده است.

این دسته از نمایش دهنده ها دو مشکل اساسی دارند:

اول اینکه اصل سند باید بر روی کلایت دانلود شود که به طور بالقوه یک مسئله امنیتی قابل توجهی برای محتوای سند شما محسوب میشود.

دوم اینکه نرم افزار های 3rd party  باید بر روی کلایت نصب شوند مانند پلاگین در مرورگرها

اما نمایش دهنده های نوع دوم این مشکلات نخواهند داشت. آنها سند اصلی را به مجموعه ای از کدهای HTML ،  تصاویر ،  CSS, و JavaScript تبدیل میکنند و سپس این داده ها را به سمت کلاینت منتقل میکنند. در نتیجه انچه که کاربر نهایی در مرورگر خود میبیند یک مجموعهHTML  معمولی خواهد بود که دیگر نیازی به نصب پلاگین در سمت کلاینت ندارد.

GroupDocs.Viewer for .NET متعلق به گروه دوم میباشد و این توانایی را دارد که بیش از 50 نوع سند را در مرورگر نمایش دهد.  در واقع هر دستگاهی که بتواند HTML رانمایش دهد امکان استفاده از این ابزار را نیز خواهد داشت. مهمترین مزیت این ابزار این است که بطور پیشفرض تمام سند را برای نمایش به مررگر منتقل نمیکند بلکه بنابه نیاز قسمتی ار اطلاعات به صورت داده ای  Stream ارسال میگردد. GroupDocs.Viewer نیاز به دات نت فریم ورک چهار و بالاتر دارد درنتیجه در پروژه های ASP.NET WebForms  یا  ASP.NET MVC version 3به بالا قابل استفاده است.

برای کار با این میان افزار ساده ترین راه این است که dll انرا به پروژه خود اضافه کنید (Add refrence)

سپس به فایل Global.asax کدهای زیر را اضافه کنید

Viewer.InitRoutes();  
Viewer.SetRootStoragePath(Server.MapPath("~/testfiles/")); // Documents will also be cached here  
Viewer.SetLicensePath(Server.MapPath("SomePathToYourLisenceFile")); //in our case its free/unlicence dll :)  
//Remember testfiles is just folder which contains your different document like abc.pdf,xyz.tif etc.i have add these files below in step-7.

حالا باید در فایل web.config در میان تگ system.web  تگ هندلر زیر را اضافه کنید

<httpHandlers>  
<add verb="GET,POST" path="document-viewer/ViewDocumentHandler" type="Groupdocs.Web.UI.Handlers.ViewDocumentHandler, Groupdocs.Viewer, Culture=neutral" validate="false" />  
<add verb="*" path="document-viewer/GetDocumentPageImageHandler" type="Groupdocs.Web.UI.Handlers.GetDocumentPageImageHandler, Groupdocs.Viewer, Culture=neutral" validate="false" />  
<add verb="*" path="document-viewer/LoadFileBrowserTreeDataHandler" type="Groupdocs.Web.UI.Handlers.LoadFileBrowserTreeDataHandler, Groupdocs.Viewer, Culture=neutral" validate="false" />  
<add verb="*" path="document-viewer/GetImageUrlsHandler" type="Groupdocs.Web.UI.Handlers.GetImageUrlsHandler, Groupdocs.Viewer, Culture=neutral" validate="false" />  
<add verb="GET" path="document-viewer/CSS/GetCssHandler" type="Groupdocs.Web.UI.Handlers.CssHandler, Groupdocs.Viewer, Culture=neutral" validate="false" />  
<add verb="GET" path="document-viewer/images/*" type="Groupdocs.Web.UI.Handlers.EmbeddedImageHandler, Groupdocs.Viewer, Culture=neutral" validate="false" />  
<add verb="GET" path="document-viewer/fonts/*" type="Groupdocs.Web.UI.Handlers.GetFontHandler, Groupdocs.Viewer, Culture=neutral" />  
<add verb="GET,POST" path="document-viewer/GetScriptHandler" type="Groupdocs.Web.UI.Handlers.ScriptHandler, Groupdocs.Viewer, Culture=neutral" validate="false" />  
<add verb="GET" path="document-viewer/GetFileHandler" type="Groupdocs.Web.UI.Handlers.GetFileHandler, Groupdocs.Viewer, Culture=neutral" validate="false" />  
<add verb="GET,POST" path="document-viewer/GetPdf2JavaScriptHandler" type="Groupdocs.Web.UI.Handlers.GetPdf2JavaScriptHandler, Groupdocs.Viewer, Culture=neutral" validate="false" />  
<add verb="GET,POST" path="document-viewer/GetPdfWithPrintDialogHandler" type="Groupdocs.Web.UI.Handlers.GetPdfWithPrintDialogHandler, Groupdocs.Viewer, Culture=neutral" validate="false" />  
<add verb="GET,POST" path="document-viewer/GetPrintableHtmlHandler" type="Groupdocs.Web.UI.Handlers.GetPrintableHtmlHandler, Groupdocs.Viewer, Culture=neutral" />  
<add verb="GET,POST" path="document-viewer/GetResourceForHtmlHandler" type="Groupdocs.Web.UI.Handlers.GetResourceForHtmlHandler, Groupdocs.Viewer, Culture=neutral" />  
<add verb="GET,POST" path="document-viewer/GetDocumentPageHtmlHandler" type="Groupdocs.Web.UI.Handlers.GetDocumentPageHtmlHandler, Groupdocs.Viewer, Culture=neutral" />  
<add verb="GET,POST" path="document-viewer/ReorderPageHandler" type="Groupdocs.Web.UI.Handlers.ReorderPageHandler, Groupdocs.Viewer, Culture=neutral" />  
<add verb="GET,POST" path="document-viewer/RotatePageHandler" type="Groupdocs.Web.UI.Handlers.RotatePageHandler, Groupdocs.Viewer, Culture=neutral" />   
</httpHandlers>

حالا نوبت به استفاده از این ویژگی در صفحه وب هست در بالای صفحه ای که قصد دارید از آن استفاده کنید فضای نام آنرا اضافه کنید

<%@ Import Namespace="System.NET" %>   
<%@ Import Namespace="Groupdocs.Web.UI" %>   

همچنین این خط را را نیز به صفحه اضافه کنید

//To Load Jquery.  
<%= Viewer.CreateScriptLoadBlock().LoadJquery().LoadJqueryUi() %>   

حالا هشت div  برای نمایش هشت فرمت رایج و معمول به صفخه اضافه میکنیم.

<div id="pdf" style="width: 900px; height: 500px; position: relative; margin-bottom: 20px;"></div>    
<div id="excel" style="width: 900px; height: 500px; position: relative; background-color: gray"></div>    
<div id="image" style="width: 900px; height: 500px; position: relative; background-color: gray"></div>    
<div id="tiff" style="width: 900px; height: 500px; position: relative; background-color: gray"></div>    
<div id="txt" style="width: 900px; height: 500px; position: relative; background-color: gray"></div>    
<div id="rtf" style="width: 900px; height: 500px; position: relative; background-color: gray"></div>    
<div id="word" style="width: 900px; height: 500px; position: relative; background-color: gray"></div>    
<div id="png" style="width: 900px; height: 500px; position: relative; background-color: gray"></div> 

و نهایتا برای نمیش محتوای div  ها از کد زیر بهره میگیریم

<%--pdf--%>    
<%= Viewer.ClientCode()    
   .TargetElementSelector("#pdf")    
   .FilePath("candy.pdf")    
   .ZoomToFitWidth()    
   .Width(900)    
   .Height(400)    
%>    
<%--Excel--%>    
<%= Viewer.ClientCode()    
   .TargetElementSelector("#excel")    
   .FilePath("Timesheet.xls")    
   .OpenThumbnails(false)    
   .Width(900)    
   .Height(400)    
   .ZoomToFitHeight()    
   .Locale("nb-NO")    
   .BackgroundColor("#777")    
   .UseHtmlBasedEngine()    
%>    
<%--JPG--%>    
<%= Viewer.ClientCode()    
   .TargetElementSelector("#image")    
   .FilePath("image.jpg")    
   .OpenThumbnails(false)    
   .ZoomToFitHeight()    
   .Locale("nb-NO")    
   .BackgroundColor("#777")    
   .UseHtmlBasedEngine()    
%>    
<%--tiffFile--%>    
<%= Viewer.ClientCode()    
   .TargetElementSelector("#tiff")    
   .FilePath("as.tif")    
   .OpenThumbnails(false)    
   .ZoomToFitHeight()    
   .Width(900)    
   .Height(400)    
   .Locale("nb-NO")    
   .BackgroundColor("#777")    
   .UseHtmlBasedEngine()    
%>    
<%--txt File--%>    
<%= Viewer.ClientCode()    
   .TargetElementSelector("#txt")    
   .FilePath("Txt.txt")    
   .OpenThumbnails(false)    
   .ZoomToFitHeight()    
   .Width(900)    
   .Height(400)    
   .Locale("nb-NO")    
   .BackgroundColor("#777")    
   .UseHtmlBasedEngine()    
%>    
<%--rtf File--%>    
<%= Viewer.ClientCode()    
   .TargetElementSelector("#rtf")    
   .FilePath("RTF.rtf")    
   .OpenThumbnails(false)    
   .ZoomToFitHeight()    
   .Width(900)    
   .Height(400)    
   .Locale("nb-NO")    
   .BackgroundColor("#777")    
   .UseHtmlBasedEngine()    
%>    
<%--wordFile--%>    
<%= Viewer.ClientCode()    
   .TargetElementSelector("#word")    
   .FilePath("word.doc")    
   .OpenThumbnails(false)    
   .ZoomToFitHeight()    
   .Width(900)    
   .Height(400)    
   .Locale("nb-NO")    
   .BackgroundColor("#777")    
   .UseHtmlBasedEngine()    
%>    
<%--PNG File--%>    
<%= Viewer.ClientCode()    
   .TargetElementSelector("#png")    
   .FilePath("png.png")    
   .OpenThumbnails(false)    
   .ZoomToFitHeight()    
   .Width(900)    
   .Height(400)    
   .Locale("nb-NO")    
   .BackgroundColor("#777")    
   .UseHtmlBasedEngine()    
%>    
    
<%--Encrypted EXCEL File--%>    
<%= Viewer.ClientCode()    
   .TargetElementSelector("#encrpt-excel")    
   .FilePath("EXCEL.xlsx")    
   .OpenThumbnails(false)    
   .ZoomToFitHeight()    
   .Width(900)    
   .Height(400)    
   .Locale("nb-NO")    
   .BackgroundColor("#777")    
   .UseHtmlBasedEngine()    
%>   

فایل کامل این مثال که توسط خود شرکت سازنده ارائه شده ضمیمه این مقاله است با دانلود و بررسی  آن بهتر با نحوه کارکرد این کتابخانه آشنا میشوید.