References ▼
Document Library JavaScript support is included in Visual Studio solutions and projects with source code that is located in your machine at the following locations:
All services provide compatible endpoints that are configured to the ~/api/* directory. Therefore, the clients can connect to any of the services by changing the service host or path described below.
fx\DocumentService is a .NET Framework ASP.NET Web API application project that serves as the server-side code for the clients mentioned below. It can be run only on a Windows machine.
Installation path: [LEADTOOLS_INSTALLATION]\Examples\Document\JS\DocumentServiceDotNet\fx\DocumentService.csproj
core\DocumentService is a .NET Core version of the service that can run on Windows, Linux, and macOS.
Installation Path: [LEADTOOLS_INSTALLATION]\Examples\Document\JS\DocumentServiceDotNet\core\DocumentService.csproj
DocumentServiceJava is a Java version of the service that can run on Windows, Linux, and macOS.
Installation Path: [LEADTOOLS_INSTALLATION]\Examples\Document\JS\DocumentServiceJava\document-service
| Client | Location |
|---|---|
| Document Viewer Demo | [LEADTOOLS_INSTALLATION]\Examples\Viewers\JS\DocumentViewerDemo\DocumentViewerDemo.sln |
| Document Compare Demo | [LEADTOOLS_INSTALLATION]\Examples\Viewers\JS\DocumentCompareDemo\DocumentCompareDemo.sln |
| Document Composer Demo | [LEADTOOLS_INSTALLATION]\Examples\Viewers\JS\DocumentComposerDemo\DocumentComposerDemo.sln |
| LEADVIEW Document Viewer Demo | [LEADTOOLS_INSTALLATION]\Examples\Viewers\JS\LEADVIEW_DocumentViewerDemo\LEADVIEW_DocumentViewerDemo.csproj |
These projects contain client-side projects with HTML, CSS, and JavaScript user interface code. These projects can run on any HTML5-supported desktop or mobile web browser. Both a Microsoft TypeScript version and compiled JavaScript version are included for each client. Full source code is included and can be modified to suit your application's needs.
Leadtools.Document.js serves as the JavaScript proxy for the .NET Document Library classes. This proxy hides the web service implementation and exposes the Document Library as a native JavaScript library containing classes and objects. Your application should use these classes to interact with the server code.
To start using the DocumentViewer, simply open DocumentViewer.sln in Visual Studio, select the startup projects (the client and server projects to run) and press F5. This will run the document viewer using IIS Express, which is most suitable for development. You can set breakpoints in the client JavaScript code or in the server C# code, as needed.
At any time, right-click the project in Solution Explorer and select Deploy to host the application in IIS on the same machine, a separate machine, or in the cloud. Refer to this article in MSDN for more information.
During development or deployment, you may want to modify appsettings.json to update the server side options such as the cache directory, OCR engine type, or Raster Codecs options, if needed.
The DocumentFactory class contains the following properties that are needed to set up the client to access the server code:
| Member | Value |
|---|---|
| ServiceHost | The URL to the service host. The default value is null, which means to use the same host as the client (for example, http://localhost:port for IIS Express, http://localhost in general, or http://current_ip_address). When deploying the service to another machine or into the cloud, it is best to keep the server and client code on the same host. Otherwise, be sure to configure the implementation of CORS in the service. |
| ServicePath | The path from the host to the application root. The default value is null, which means to use the path to the client. By default, the project is set up such that api endpoints directory (../path/to/application/api) is only slightly different from the directory of the client (../path/to/application/app). This means that the value of ServicePath will be ../path/to/application/app. However, the ServiceApiPath property exists so that this property need not be changed if the client and server reside mostly along the same path. |
| ServiceApiPath | The path to the api endpoints of the service. The default value is null as explained above, the project is set up such that api endpoints directory (../path/to/application/api) is only slightly different from the directory of the client (../path/to/application/app). This means that the value of ServicePath will be ../path/to/application/app. To make the proper adjustment over to the api folder, the DocumentViewer client sets this to ../api. This way, ServicePath does not need to be set to an explicit value. |
| ServiceUri | Gets the full URL of the service, concatenating ServiceHost (or the client host if null), ServicePath (or the client path if null), and ServiceApiPath. This means that if no values are set, ServiceUri will be the full path to the client; if we change the ServiceApiPath to ../api, the ServiceUri will become the default location of the api namespace. The ServiceUri, when built, will strip out unneeded trailing slashes. |
The JavaScript application that uses the LEADTOOLS Document library must set the values in DocumentFactory at the beginning of the program, if required. These values are global and can be accessed from any part of the application. The various classes, objects, and commands of the JavaScript proxies use these values when needed to make calls to the web service and obtain results. For example, you can start using the LoadFromUri to create a new LEADDocument object from a URL and start using it in your application.
Many methods in lt.Document of Leadtools.Document.js will send requests to the web service to execute code on the server. Generally, [DocumentFactory.ServiceUserData] can be used to send additional data with any of these requests. [DocumentFactory.PrepareAjax] also allows requests to be modified before sending.
To see exactly what other properties are sent with each request, check the source code of the .NET or Java service. The .NET Web API service includes a documentation module that allows developers to view the API documentation by running the service and navigating to [service-uri]/help. For example, the documentation for the most recent online version of the online DocumentViewer's .NET Framework service is located at https://demo.leadtools.com/javascript/DocumentServiceFX/swagger/.
Developers can also view these same request and response classes by opening the TypeScript declaration files (specifically Leadtools.Document.d.ts) included in the LEADTOOLS installation and looking for the lt.Document.Service internal namespace.
| Loading Images in the Document Library |