ASP.NET Core DocumentViewer

This article shows how to setup a new project with DS Server and how to use the document editor NuGet package in an ASP.NET Core MVC web application.

Trial Token

If you are evaluating DS Server and you are using a trial token, you can skip the Prerequisites - DS Server Installation and the DS Server Setup part and continue with the integration.


ASP.NET Core MVC Web Application

Prerequisites - DS Server Installation

In order to follow these tutorials, DS Server must be successfully installed and licensed on a server. To learn how to do that, read the following articles:

DS Server Setup

In the DS Server admin portal, a new security profile needs to be added.

  1. Select Security Profiles from the main menu to open the security profile overview. Click on Create new profile to create a new security profile:

    DS Server Setup

  2. Type in a name and confirm with Create:

    DS Server Setup

  3. The profile details are shown including the Client ID and Client Secret values required for the OAuth authentication flow:

    DS Server Setup

ASP.NET Core MVC Web Application

In the next step, a new ASP.NET Core MVC Web Application is created in Visual Studio 2019.

  1. In Visual Studio 2019, create a new ASP.NET Core Web Application, choose a name and confirm with Create.

  2. In the next dialog, choose Web Application (Model-View-Controller) and confirm with Create:

    DS Server Setup

  3. Select Manage NuGet Packages for Solution... from the NuGet Package Manager menu entry in the Tools main menu. Search for the package TXTextControl.DocumentServices.DocumentViewer and confirm with Install.

    DS Server Setup

  4. Open the Index.cshtml in the Views -> Home folder and replace the content with the following code:

    @using TXTextControl.DocumentServices.DocumentViewer;
    
    @await Html.TXTextControl().DocumentViewer(s => {
        s.DocumentData = "SGVsbG8gdGhlcmU=";
        s.Dock = DocumentViewerSettings.DockStyle.Window;
        s.IsSelectionActivated = true;
        s.ShowThumbnailPane = true;
        s.BasePath = "https://yourdomain.com/DocumentServices";
        s.OAuthSettings.ClientId = "dsserver.ZVOL4OPU664IqA0NMJAisrX2iCeLaOmo";
        s.OAuthSettings.ClientSecret = "faZwTMHRe0VgKfyvMgD8FM8eOKymEst3";
        s.OAuthSettings.RedirectUri = "https://yourdomain.com/DocumentEditor/textcontrol/DocumentEditor/auth/callback";
    }).RenderAsync()

    The ServiceUrl property should point to your on-premise DS Server installation.

    Trial Token

    If you are evaluating DS Server and you are using a trial token, remove the third parameter in the OAuthSettings (RedirectUri) and replace the BasePath with the demo server location https://trial.dsserver.io.

    Copy the below code and ignore the following steps that are not required when using the trial tokens.


    @using TXTextControl.DocumentServices.DocumentViewer;
    
    @await Html.TXTextControl().DocumentViewer(s => {
        s.DocumentData = "SGVsbG8gdGhlcmU=";
        s.Dock = DocumentViewerSettings.DockStyle.Window;
        s.IsSelectionActivated = true;
        s.ShowThumbnailPane = true;
        s.BasePath = "https://trial.dsserver.io";
        s.OAuthSettings.ClientId = "dsserver.ZVOL4OPU664IqA0NMJAisrX2iCeLaOmo";
        s.OAuthSettings.ClientSecret = "faZwTMHRe0VgKfyvMgD8FM8eOKymEst3";
    }).RenderAsync()
  5. Compile and start the application. You should see the following error, because the required "authorized redirect URI" has not been specified in the security profile:

    DS Server Setup

    Copy the URL from the location bar (https://localhost:44374) into the clipboard or note it.

  6. Back in the DS Server admin portal, open the created security profile and click Add URI. Paste the URL followed by the string /textcontrol/documentviewer/auth/callback. Add the following complete string to the "Authorized Redirect URI" text box:

    https://localhost:44374/textcontrol/documentviewer/auth/callback

    DS Server Setup

    Confirm this step by clicking Save.

  7. Restart the Visual Studio project or refresh the browser.