This tutorial shows how to configure and run the LEADTOOLS Document Viewer Demo with the Document Service.
|Summary||This tutorial covers how to properly run the LEADTOOLS Document Viewer Demo.|
|Completion Time||5 - 10 minutes|
|IDE||Visual Studio 2017, 2019|
|Development License||Download LEADTOOLS|
Be sure to download and install the LEADTOOLS SDK, and make sure that your license and key files are located in your
To start off, navigate to the demo in File Explorer. Once the LEADTOOLS SDK is installed, the demo can be found at the following directory:
The demo includes a
DocumentViewerDemo.sln solution file. This Visual Studio solution contains 2 C# ASP.NET Projects, one written in TypeScript (
Open the Solution in Visual Studio and explore the resources and options already available. Decide on which type of project to compile, and whether to use the TypeScript demo.
The Document Viewer Demo relies on a server-side backend for some of its functionality:
The Document Service is written in 3 different languages. Each Service uses a different Port, by default, when deploying.
|Language||Path to Service Project||Default Url||Compatible OS|
||Windows, Linux, Mac|
||Windows, Linux, Mac|
By default, the Document Viewer Demo is configured to work with the .NET Framework service. To change the URL to work with another service URL, simply open
<INSTALL_DIR>\LEADTOOLS21\Examples\JS\DocumentViewerDemos\DocumentViewerDemo\site\serviceConfig.json and modify the
serviceHost value to the correct URL:
The .NET Framework Document Service has 2 different projects that can be opened. The
DocumentService.csproj uses local references from
<INSTALL_DIR>\LEADTOOLS21\Bin\Dotnet4\<CPU_ARCH>, and the
DocumentService_Nuget.csproj uses NuGet Packages. Choose the one to be used, and open it in Visual Studio.
Run the project through Visual Studio and explore the resources and options already available. Decide on the type of project to compile, and whether to use the NuGet Packages.
The .NET Core Document Service
DocumentService.csproj uses NuGet Packages. This project can be built and run on any operating system that has .NET Core installed on it. It can be run through Visual Studio on Windows via
When running on Linux or outside of Visual Studio, run
dotnet publish from the development environment to package the application into a directory (for example,
bin\Debug\netcoreapp2.1\publish). Copy the new
publish directory to the machine in the desired location, then test the application using
dotnet DocumentService.dll and browse to the URL.
To set up the Java Environment for use with the LEADTOOLS Document Service, refer to the PDF located here:
Now that the Document Service is running and the Document Viewer Demo is properly set up to use the URL in the
serviceConfig.Json file as described in the steps above, run the Document Viewer Demo via Visual Studio.
When it launches, it will connect to the service and load a default PDF. If there are any issues during the setup, this is typically where they will appear.
If the Document Service is not running when launching the Document Viewer Demo, a dialog will open in the browser with the message
Cannot reach the LEADTOOLS Document Service.Retry the steps above to verify the Document Viewer Demo is using the correct URL and that the service is actively running. If both are set up correctly, check the Console in the Browse Dev Tools (F12) for any errors listed.
Once everything is set up and the default PDF is loaded into the viewer, other documents and images can now be loaded via the File menu. There are 4 different methods of loading a document:
Dialog menu of the 4 different methods:
The following table describes the 4 methods:
|Open local file||Open a local file from the client system|
|Open from URL||Open a file from a URL|
|Open from cache||Open a file that has been saved to the Document Viewer cache on the server|
|Open from cloud storage||Open from a connected cloud provider such as SharePoint, Google Drive, or One Drive|
When a Document is ready to be saved, it can be exported to a different format than the original. To do so, open the File menu, choose Export and choose the desired options.
The Document Viewer demo has many settings and options that can be adjusted as needed. There are both client-side settings and server-side settings. In the case where there is a setting on both the server-side and client-side, the server-side settings take precedence.
Preferences menu item and then click on the
Document Viewer Options. Modify any settings as necessary and then click
Apply to enact the changes.
In the Server project, modify the settings with any of the following files:
|Language||Path to Settings File|
When modifying the properties of the .NET Framework and the .NET Core projects, be sure that the file being modified is the one in the
\DocumentServiceDotNet\src\folder and not in the
\DocumentServiceDotNet\corefolders, as those are just copies of the
src\appsettings.json. Any modifications to them gets overwritten by the
src\appsettings.jsonfile upon build.
This tutorial showed how to connect and configure the LEADTOOLS Document Viewer Demo to the Document Service and how to load and export a document, as well as modify the settings on both the client-side and server-side.