DocuVieware integration in a .NET Core 2.2 web application

This guide explains how to integrate DocuVieware in a newly created C# .NET Core MVC web application project with Razor view engine.

Legacy guide notice

This guide describes a legacy integration approach using ASP.NET Core 2.2 and Visual Studio 2017 with GdPicture.NET 14. ASP.NET Core 2.2 has reached end of life and is no longer recommended for new applications.

Requirements — .NET Framework 4.6 or above

Note — Screenshots and version-specific details may differ from the current release.

This guide is intended for maintaining existing applications within environments that have fixed legacy constraints.

Empty project creation

Start with the File > New > Project… menu. Then, in Visual C#, choose .NET Core > ASP.NET Core Web Application. In this guide, you’ll be working on DocuViewareNetCore, a new ASP.NET Core MVC project.

Make sure to target the application to .NET Framework 4.7.0 (at least). The project needs to target ASP.NET Core 2.2, as shown in the screenshot below.

This legacy integration relies on .NET Framework assemblies, even though the application is based on ASP.NET Core.

Visual Studio new project dialog showing .NET Core 2.2 and .NET Framework 4.7 target selection

Below is the resulting structure.

Solution Explorer showing the DocuViewareNetCore project structure with Controllers, Views, and wwwroot folders

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

Adding mandatory references

Below are the references and prerequisites needed to properly integrate DocuVieware in a .NET Core 2.2 web application project.

DocuVieware references and prerequisites

  1. Add GdPicture.NET.14.WEB.DocuVieware.dll, found in [INSTALLATION FOLDER]\Redist\DocuVieware (.NET Framework 4.6).

  2. Add a reference to System.Web, which is part of the .NET Framework.

    Reference Manager dialog showing System.Web assembly selected under Assemblies Framework

  3. Add the Microsoft.AspNetCore.Mvc.WebApiCompatShim NuGet package to enable ASP.NET Web API support in .NET Core.

If you encounter the compile error “Assembly location for Razor SDK Tasks was not specified,” install the Microsoft.AspNetCore.Razor.Design and Microsoft.NET.Sdk.Razor NuGet packages.

Additional resources

Add DocuVieware JavaScript and CSS to the project using docuvieware-min.js and docuvieware-min.css, both of which are found in [INSTALLATION FOLDER]\Redist\DocuVieware (Resources). Add them to the css and js folders of the project.

Download jquery.min.js from jQuery’s download page(opens in a new tab), or use the file included in the samples. This file isn’t added automatically when creating the project.

Licensing and configuring

Now that the references are properly set, go to the Startup.cs file of the project to add mandatory imports and handle the licensing and configuration of DocuVieware.

Import the following DLLs:

C#
using System.IO;
using GdPicture14.WEB;

To unlock DocuVieware, add a call to the RegisterKEY() method in the Configure method. Replace the placeholder with your actual license key.

C#
DocuViewareLicensing.RegisterKEY("XXXX"); // Unlocking DocuVieware
// Replace "XXXX" with your actual license key.

To set up the configuration of DocuVieware, add a call to the DocuViewareManager.SetupConfiguration() method in the same Configure method. Create a new folder in the project for the cache and name it Cache:

C#
// DocuVieware Core Configuration
DocuViewareManager.SetupConfiguration(true, DocuViewareSessionStateMode.File, Path.Combine(Directory.GetCurrentDirectory(), "Cache"), "/", "api/docuvieware3");

Finally, add this code to the ConfigureServices method to enable the DocuVieware reference in Razor views:

C#
services.AddMvc()
 // Enabling Web API 2 projects compatibility layout support for .NET Core
 .AddWebApiConventions()
 // 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));
 };
 });

The image below shows what the Startup.cs file should look like at this point.

Startup.cs file showing DocuVieware licensing and configuration code

You can find the source code here: [INSTALLATION FOLDER]\Samples\ASP.NET\DocuVieware\aspnetcore-mvc\_razor\_app\docuvieware\_demo\Startup.cs.

DocuVieware integration

First, create an additional controller to handle and route DocuVieware actions. Create a new controller called DocuVieware3Controller.cs in the project’s Controllers folder:

C#
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);
 }
 }
}

Integrate a DocuVieware instance in the Index view. The same approach 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 guide.

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.

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

HTML
@{
 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 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.