The requested page is not available for the requested platform. You are viewing the content for Default platform.

Create an ASP.NET Core Application with a Document Viewer

  • 4 min to read

This tutorial describes how to use the DevExpress Template Gallery or .NET Core command line interface (CLI) to generate a basic ASP.NET Core application that contains the HTML5 Document Viewer control.


See ASP.NET Core Reporting for information about DevExpress Reporting in ASP.NET Core applications.

The Add a New Report to an ASP.NET Core Application tutorial provides instructions on how to add a report to an ASP.NET Core application.

Perform the following steps to create an ASP.NET Core application in Visual Studio:

  1. Select FILE | New | Project in the main menu or press CTRL+SHIFT+N to create a new project.


  2. Select the Installed | Visual C# | Web category in the invoked New Project dialog and select the DevExpress v19.2 Template Gallery template.


    Specify the application name and click OK.

  3. Select Reporting Application from the NET Core category in the invoked DevExpress Template Gallery and click Create Project.


  4. Enable the Add Viewer Page checkbox in the invoked DevExpress ASP.NET MVC Project Wizard to add the Document Viewer to the web application (the Viewer.cshtml page).


    You can add a Web Document Viewer and a Report Designer to the application.


    Use the following Document Viewer settings:

    • Add Report Storage - Specifies whether to create a sample server-side report storage. This storage allows users to open report layout files (REPX) from the Reports folder and instances of report types predefined in the assembly.
    • Report Storage Name - Specifies the report storage class name.
    • Log Errors and Events - Specifies whether to use the LoggerService class to log server-side errors and events related to the Document Viewer functionality to a particular file.

    See Create an ASP.NET Core Application with a Report Designer for information on other settings.

    Click Create Project to apply these settings to the project.

  5. Once Visual Studio created an application, right-click the Dependencies | npm folder in the Solution Explorer window and choose Restore Packages (you should run Visual Studio with administrator privileges).

  6. You can specify a report to open in the Document Viewer when the application starts. Navigate to the Views | Home | Viewer.cshtml file and replace the built-in unique report name with your report's name:


Use the Console

Use the .NET Core command line interface (CLI) to create an ASP.NET Core Reporting application from the console:

  1. Open the console and type the following command to install DevExpress CLI templates:

    dotnet new -i "DevExpress.DotNet.Web.ProjectTemplates"

    The console displays the list of templates installed on your machine after the installation command is finished.

  2. Refer to the page and obtain the NuGet Feed URL. This URL includes your personal feed authorization key and is used to install NuGet packages for the Document Viewer.

  3. Use the command below to create a new project with the Document Viewer. Pass the the NuGet Feed URL as a parameter.

    dotnet new dx.reporting --nuget-feed{auth_key}/api --name DocumentViewerApp --add-designer false

    DevExpress Reporting templates have the following parameters:

    • -nf | --nuget-feed (required) - Specifies your personal DevExpress NuGet Feed URL.
    • -ad | --add-designer - Specifies whether to create a web page with the Report Designer. The default value is true.
    • -av | --add-viewer - Specifies whether to create a web page with the Document Viewer. The default value is true.
    • -ads | --add-data-source - Specifies whether to add a sample database file to a project and register the corresponding connection string in the application's configuration file. The default value is false.
    • -ul | --use-logger - Specifies whether to log server-side errors and events related to the Document Viewer functionality to a specific file. The default value is false.
  4. Run the commands below to navigate to the created application's folder and download the client resources.

    cd DocumentViewerApp

    npm install


    Install Node.js and npm if they do not exist on your machine.

  5. Use the following commands to restore dependencies, build the application, and get the application's URL:

    dotnet restore

    dotnet run

  6. Open your browser and insert the generated URL to see the result.