In This Topic
Tutorials / ASP.NET Core / DocuVieware integration in .NET Core 2.2 web application

DocuVieware integration in .NET Core 2.2 web application

In This Topic
 Overview

This tutorial will show you how to integrate DocuVieware™ in a newly created C# .NET Core MVC Web Application project with Razor view engine.

This tutorial has been done using .NET Core 2.2, other versions will most probably differ.
DocuVieware™ requires .NET Framework 4.6 or above.
The screenshots have been taken using Visual Studio 2017 and GdPicture.NET™ 14, it may differ from the current release.
 Empty project creation

Start with the File > New > Project... menu, then in Visual C# choose .NET Core > ASP.NET Core Web Application. In this tutorial you will be working on DocuViewareNetCore which is a new ASP.NET Core MVC project.

Make sure to target the application to .NET Framework at least 4.7.0 and the project need to target ASP.NET Core 2.2 as shown on the screeshot below. You need to set those values manually in the window as it is demonstrated below.

Here is the structure obtained:

Now that the project structure is ready, the next step will be to add project references.

 Adding mandatory referencies
 DocuVieware references and prerequisites

Step 1: The first reference to add is GdPicture.NET.14.WEB.DocuVieware.dll that is found in [INSTALLATION FOLDER]\Redist\DocuVieware (.NET Framework 4.6)\.

Step 2: It is required to also add a reference to System.Web that is part of the .NET Framework.

Step 3: You also need to add the Microsoft.AspNetCore.Mvc.WebApiCompatShim NuGet package to enable ASP.NET Web API support in .NET Core.

If you will encounter the compile error like this: "Assembly location for Razor SDK Tasks was not specified.", you will need tu install these NuGets:

Microsoft.AspNetCore.Razor.Design
Microsoft.NET.Sdk.Razor

 Additional resources

You also need to add DocuVieware™ own JavaScript and CSS to the project, docuvieware-min.js and docuvieware-min.css, both found in [INSTALLATION FOLDER]\Redist\DocuVieware (Resources)\, simply add them to the css and js folders of the project.

Next, you will also need to download jquery.min.js, for example from https://jquery.com/download/ or you can use also one attached to our samples. It is simply because this file will not be added automatically when creating the project.

 Licensing and configuring

Now that the references are properly set, you need to go to the Startup.cs file of the project to add some mandatory imports and handle the licensing part and the configuration part of DocuVieware™ as well.

You will probably need to import some dlls, please refer below.

Importing the dll.
Copy Code 
using System.IO;
using GdPicture14.WEB;

To properly unlock DocuVieware™ you are going to add a call to the RegisterKEY() method in the Configure method that is called on runtime. Then please enter your license key in the method.

Unlocking the DocuVieware™.
Copy Code 
DocuViewareLicensing.RegisterKEY("XXXX"); // Unlocking DocuVieware
// You need to replace "XXXX" by your actual license key.

 To set up the configuration of DocuVieware™ you are going to add a call to the DocuViewareManager.SetupConfiguration() method in the same Configure method. At this point you need to create a new folder in the project that will be used for cache, for the sake of clarity simply name it Cache. 

Configuring the DocuVieware™.
Copy Code 
// DocuVieware Core Configuration
DocuViewareManager.SetupConfiguration(true, DocuViewareSessionStateMode.File, Path.Combine(Directory.GetCurrentDirectory(), "Cache"), "/", "api/docuvieware3");

Finally, you need to add this code to the ConfigureServices method in order to get the DocuVieware™ reference to work in the Razor views it will be integrated in.

Add this code to the ConfigureServices method.
Copy Code 
services.AddMvc()
    // Enabling Web API 2 projects compatibility layout support for .NET Core
    .AddWebApiConventions()
    // We need to explicitly add DocuVieware reference to Razor compilation using RazorViewEngineOptions.CompilationCallback
    .AddRazorOptions(options =>
    {
        var previous = options.CompilationCallback;
        options.CompilationCallback = context =>
        {
            previous?.Invoke(context);
            context.Compilation = context.Compilation.AddReferences(Microsoft.CodeAnalysis.MetadataReference.CreateFromFile(typeof(DocuVieware).Assembly.Location));
        };
     });

Here is what the Startup.cs file should look like at this point:

You can find the source code available here: [INSTALLATION FOLDER]\Samples\ASP.NET\DocuVieware\aspnetcore-mvc_razor_app\docuvieware_demo\Startup.cs
 DocuVieware integration

First, you need an additional controller to handle and route the DocuVieware™ actions. Simply create a new controller called DocuVieware3Controller.cs in the project's Controllers folder as follow:

Creating a new controller.
Copy Code 
using Microsoft.AspNetCore.Mvc;
using GdPicture14.WEB;
using System.Net.Http;
using System.Net;
namespace DocuViewareNetCore.Controllers
{
    [Route("api/docuvieware3")]
    public class DocuVieware3Controller : Controller
    {
        [HttpGet("ping")]
        public string ping()
        {
            return "pong";
        }

        [HttpPost("baserequest")]
        public string baserequest([FromBody] object jsonString)
        {
            return DocuViewareControllerActionsHandler.baserequest(jsonString);
        }
                               
                                                
        [HttpGet("print")]
        public HttpResponseMessage Print(string sessionID, string pageRange, bool printAnnotations)
        {
            return DocuViewareControllerActionsHandler.print(sessionID, pageRange, printAnnotations);
        }

        [HttpGet("getresource")]
        public IActionResult GetResource(string resourceID, string version)
        {
            DocuViewareControllerActionsHandler.getresource(resourceID, version, out HttpStatusCode statusCode, out byte[] content, out string contentType, out string fileName, out string reasonPhrase);
            if (statusCode == HttpStatusCode.OK)
            {
                return File(content, contentType, fileName);
            }
            else
            {
                return StatusCode((int)statusCode, reasonPhrase);
            }
        }

        [HttpGet("save")]
        public IActionResult Save(string sessionID, string fileName, string format, string pageRange, bool dropAnnotations, bool flattenAnnotations)
        {
            DocuViewareControllerActionsHandler.save(sessionID, ref fileName, format, pageRange,dropAnnotations, flattenAnnotations, out HttpStatusCode statusCode, out string reasonPhrase, out byte[] content, out string contentType);
            if (statusCode == HttpStatusCode.OK)
            {
                return File(content, contentType, fileName);
            }
            else
            {
                return StatusCode((int)statusCode, reasonPhrase);
            }
        }

        [HttpGet("twainservicesetupdownload")]
        public IActionResult TwainServiceSetupDownload(string sessionID)
        {
            DocuViewareControllerActionsHandler.twainservicesetupdownload(sessionID, out HttpStatusCode statusCode, out byte[] content, out string contentType, out string fileName, out string reasonPhrase);
            if (statusCode == HttpStatusCode.OK)
            {
                return File(content, contentType, fileName);
            }
            else
            {
                return StatusCode((int)statusCode, reasonPhrase);
            }
        }

        [HttpPost("formfieldupdate")]
        public string FormfieldUpdate([FromBody]object jsonString)
        {
            return DocuViewareControllerActionsHandler.formfieldupdate(jsonString);
        }

        [HttpPost("annotupdate")]
        public string AnnotUpdate([FromBody]object jsonString)
        {
            return DocuViewareControllerActionsHandler.annotupdate(jsonString);
        }
                  
        [HttpPost("loadfromfile")]
        public string LoadFromFile([FromBody]object jsonString)
        {
            return DocuViewareControllerActionsHandler.loadfromfile(jsonString);
        }

        [HttpPost("loadfromfilemultipart")]
        public string LoadFromFileMultipart()
        {
            return DocuViewareControllerActionsHandler.loadfromfilemultipart(Request);
        }                        
    }
}

You are going to integrate a DocuVieware™ instance in the Index view, but of course the exact same applies to any other view or content.

For the sake of clarity, replace the entire content of the Index view, remove other views and the shared layouts as well, you won't use them in this tutorial.

Create a div in Index.cshtml and insert the DocuVieware™ control in it. Then create a new DocuVieware™ object in the div and set its properties.

Here is what the Index.cshtml finally looks like after the integration is complete:

Integrating a DocuVieware™ instance in the Index view.
Copy Code 
@{
    Layout = null;
}
@using GdPicture14.WEB
 @using System.Web.UI.WebControls
 <!DOCTYPE html>
 <html style="height: 100%">
 <head>
    <meta name="viewport" content="width=device-width" />
    <title>DocuVieware ASP.NET Core demo application</title>
    <script src="~/js/docuvieware-min.js"></script>
    <script src="~/js/jquery.min.js"></script>
    <link href="~/css/docuvieware-min.css" rel="stylesheet" type="text/css" />
 </head>
 <body style="overflow: hidden; margin: 0; height: 100%;">
    <div style="width: 100%; height: 100%;">
       @{
          DocuVieware docuVieware = new DocuVieware
          {
             ID = "DocuVieware1",
             Height = new Unit("100%"),
             Width = new Unit("100%"),
             DisableAnnotationDrawingModePanel = true,
             EnableMultipleThumbnailSelection = false,
             EnableFormFieldsEdition = true
          };
          docuVieware.RenderControl(Output);
          docuVieware.Dispose();
       }
    </div>
 </body>
 </html>
You can find the sample source code available here: [INSTALLATION FOLDER]\Samples\ASP.NET\DocuVieware\aspnetcore-mvc_razor_app\docuvieware_demo\Views\Home\Index.cshtml

That’s it! You can start the project and load documents in your brand new DocuVieware™.