Skip to main content

Document Viewer Server-Side Application from DevExpress Template (ASP.NET MVC)

  • 2 minutes to read

This document describes how to create and configure an ASP.NET MVC application as a server-side solution to use the Document Viewer in JavaScript:

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

    Create New Web Application

  2. Select the DevExpress v22.1 Web App Template Gallery, and click Next:

    Select Web App Template Gallery

  3. Specify a project name and location, and click Create:

     Web App Template Gallery Configure Project

  4. In the invoked DevExpress Template Gallery, select Reporting Web Application from the ASP.NET MVC category and click Run Wizard.

    web-template-gallery-mvc-reporting-application

  5. Set Add Viewer Page to true to add the Document Viewer (the Viewer.cshtml view) to the web application.

    web-reporting-project-wizard-mvc-select-viewer

  6. Right-click the Controllers folder in the Solution Explorer and select Add | Controller…. Create the WebDocumentViewerController controller inherited from the WebDocumentViewerApiControllerBase class. Set up cross-origin resource sharing (CORS) on your back-end to configure permissions to access resources from a server with a different origin. Implement the Invoke action to allow CORS requests from all origins as shown below.

    using DevExpress.Web.Mvc.Controllers;
    using System.Web.Mvc;
    
    namespace ServerSide.Controllers
    {
        public class WebDocumentViewerController : WebDocumentViewerApiControllerBase {
            public override ActionResult Invoke() {
                var result = base.Invoke();
                // Allow cross-domain requests.
                Response.AppendHeader("Access-Control-Allow-Origin", "*");
                return result;
            }
        }
    }
    
  7. Use the project Properties | Web section to determine the protocol prefix (HTTP or HTTPS) and the server port number. Subsequently you specify the server-side application URL in the client application settings.

  8. Run the project.

See Also