How to C#: HTML5 Viewer
Azure
Azure
  |  
Home ›› XDoc.HTML5 Viewer ›› C# Viewer: On Azure

C# HTML5 Viewer: Deployment on AzureCloudService


Tutorial about Integrating C# .NET HTML5 Viewer to AzureCloudService Application





There are two ways for using HTML5 Viewer on AzureCloudSevice project. One is to run RasterEdge_AzureCloudService Project directly, another is to integrate HTML5 Viewer to a new AzureCloudSevice application. Following steps will guide you how to create a AzureCloudSevice project and add RasterEdge HTML5 Viewer to it.


Please note: In order to reduce the size of SDK package, all dlls are put into RasterEdge.DocImagSDK/Bin directory. All




Create a New AzureCloudService Project in Microsoft Visual Studio



Open Microsoft VisualStudio, select "New Project".


Click Visual C# and select "Cloud". Set corresponding .NET Framework and name project such as "MyAzureCloudSevice", and click OK.  (as shown in picture)





In pop-up box, select ASP.NET Web Role and edit its name. Here we assume it's MyWebRole.


Successfully created interface is as follows:






Modify RasterEdge HTML5Viewer Page



Right-click MyRole, select "Add Reference...", add related dlls listed below:


  RasterEdge.Imaging.Annotation.dll


  RasterEdge.Imaging.Basic.Codec.dll


  RasterEdge.Imaging.Basic.dll


  RasterEdge.Imaging.DICOM.dll


  RasterEdge.Imaging.Drawing.dll


  RasterEdge.Imaging.Font.dll


  RasterEdge.Imaging.JBIG2.dll


  RasterEdge.Imaging.JPEG2000.dll


  RasterEdge.Imaging.Processing.dll


  RasterEdge.Imaging.SVG.dll


  RasterEdge.XDoc.Converter.dll


  RasterEdge.XDoc.Excel.dll


  RasterEdge.XDoc.HTML5Viewer.dll


  RasterEdge.XDoc.Office.Inner.Common.dll


  RasterEdge.XDoc.Office.Inner.Office03.dll


  RasterEdge.XDoc.PDF.dll


  RasterEdge.XDoc.PDF.HTML5Editor.dll


  RasterEdge.XDoc.PowerPoint.dll


  RasterEdge.XDoc.TIFF.dll


  RasterEdge.XDoc.Word.dll


  RasterEdge.XImage.AdvancedCleanup.Core.dll


  RasterEdge.XImage.OCR.dll


  RasterEdge.XImage.OCR.Tesseract.dll


  RasterEdge.XImage.Raster.Core.dll


  RasterEdge.XImage.Raster.dll


  RasterEdge.XImage.BarcodeCreator.dll ( add as you need)


  RasterEdge.XImage.BarcodeScanner.dll ( add as you need)


Please set platform target in Build (as shown below). If you use x64 dlls, please choose x64 platform or AnyCpu here, otherwise the program are not able to run. Or you can select x86 if you use x86 dlls.





Open RasterEdge_AzureCloudService DemoProject, copy following content to your project:


  Default.aspx


  Default.aspx.cs


  Global.asax.cs


  RasterEdge_Resource_Files Folder


  RasterEdge_Demo_Docs Folder


  RasterEdge_Cache Folder


  Global.asax.cs


Note:


  Namespaces in Default.aspx.cs and Global.asax.cs should be same with WebRole name.


  In Default.aspx.cs, "Inherits" value should also be corresponding to WebRole name. (shown as follows)





Web.Config Setting.


  Add following <appSettings> node to your application. (The application cannot to work without this node.)




    <appSettings>
        <add key="cacheFolder" value="RasterEdge_Cache"/>
        <add key="resourceFolder" value="RasterEdge_Resource_Files"/>
    </appSettings>




  Add node <system.web.extensions>, maxJsonLength can be changed as needed.




    <system.web.extensions>
        <scripting>
            <webServices>
                <jsonSerialization maxJsonLength="50000000">
                </jsonSerialization>
            </webServices>
        </scripting>
    </system.web.extensions>




  Add <system.webServer> node.


You’d better to: 1. Set allowDoubleEscaping as “ture”, otherwise some requests cannot response successfully. 2. Add fill extension such as .woff, it’s mainly to insure .woff font can response and display correctly.




    <system.webServer>
        <validation validateIntegratedModeConfiguration="false"/>
        <security>
            <requestFiltering allowDoubleEscaping="true">
                <requestLimits maxAllowedContentLength="41943040"/>
            </requestFiltering>
        </security>
        <staticContent>
            <remove fileExtension=".js"/>
            <remove fileExtension=".svg"/>
            <remove fileExtension=".woff"/>
            <mimeMap fileExtension=".woff" mimeType="application/x-font-woff"/>
            <mimeMap fileExtension=".svg" mimeType="image/svg+xml"/>
            <mimeMap fileExtension=".ttc" mimeType="application/x-font-ttc"/>
            <mimeMap fileExtension=".js" mimeType="application/x-javascript"/>
        </staticContent>
        <urlCompression doStaticCompression="true" doDynamicCompression="true"/>
    </system.webServer>




Press F5, interface run as follows.