Skip to main content

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

  • 2 minutes to read

This topic explains how to create and configure an ASP.NET MVC application as a server-side solution for the Document Viewer in JavaScript applications.

Follow the steps below to create and configure the server-side application using the DevExpress Template Gallery:

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

    Visual Studio - Create New Web Application

  2. Select the DevExpress v26.1 Template Gallery (.NET Framework), and click Next:

    DevExpress Template Gallery Item in Visual Studio

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

    DevExpress 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.

    DevExpress Template Gallery - Configure Project

  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

    Set the Add Report Storage option to true. This option allows you to pass a string that specifies a report to the WebDocumentViewerExtension.Bind(String) method.
    The ReportStorageWebExtension class acts as a report name resolution service for the Document Viewer and uses the IsValidUrl(String) and GetData(String) methods. Otherwise, you need to implement and register the IReportProvider service, or pass an instance of the XtraReport class to the Bind(XtraReport) method.

  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