[Expand]General Information
[Expand]WinForms Controls
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Office File API
[Expand]Report and Dashboard Server
 [Expand]Getting Started
 [Expand]Basic Concepts and Terminology
 [Expand]Common Features
 [Collapse]Creating the Designer and Viewer Applications
  [Expand]WinForms Designer
  [Expand]WinForms Viewer
  [Collapse]Web Dashboard
    Web Dashboard Technical Overview
    Supported Browsers
    Required Client Libraries
   [Expand]ASP.NET Web Forms Dashboard Control
   [Expand]ASP.NET MVC Dashboard Extension
   [Expand]ASP.NET Core Dashboard Control
   [Collapse]HTML JavaScript Dashboard Control
     Client-Side Configuration (Modular Approach)
     Client-Side Configuration (Global Namespaces)
     Server-Side Configuration (ASP.NET MVC)
     Server-Side Configuration (ASP.NET Core)
     Client-Side Customization
     Designer and Viewer Modes
     Appearance Customization
    [Expand]Extend Web Dashboard Functionality
    [Expand]Create a Custom Item
    Mobile Layout
   [Expand]Error Logging
    Security Considerations
    Microsoft Azure Specifics
   [Expand]UI Elements
  [Expand]WPF Viewer
  [Expand]Web Viewer
 [Expand]Creating Dashboards
 [Expand]Visual Studio Integration
  End-User Documentation
 [Expand]Redistribution and Deployment
  Video Tutorials
 [Expand]Member Tables
 [Expand]API Reference
[Expand]eXpressApp Framework
[Expand]eXpress Persistent Objects
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation
View this topic on docs.devexpress.com (Learn more)

Server-Side Configuration (ASP.NET Core)

This approach is based on the client-server model, that is, you need to create a server (backend) project and a client (frontend) part that includes all the necessary styles, scripts and HTML-templates.

This document describes how to create and configure an ASP.NET Core application as a server-side solution to use the Web Dashboard.

You can start with the following tutorials:

Expanded Register Default Controller

Call the MvcBuilderExtension.AddDefaultDashboardController method to register a default controller and add a default dashboard configurator. The code snippet below shows how to add the required code to the Startup.cs file.

Note that you need to define a dashboard storage and connection strings provider in a dashboard configurator. See the corresponding sections below for more information.

Expanded Add Third-Party and DevExtreme Middleware

Use the MvcServiceCollectionExtensions.AddDevExpressControls method to provide the Third-Party and DevExtreme middleware that is assembled into an application pipeline to handle requests and responses. The code snippet below shows how to add the required code to the Startup.cs file.

Expanded Register DevExpress Middleware

Call the ApplicationBuilderExtensions.UseDevExpressControls method to register the DevExpress middleware. The code snippet below shows how to add the required code to the Startup.cs file.

Expanded Map Dashboard Route

Call the RouteBuilderExtension.MapDashboardRoute method to extend a MapRouteRouteBuilderExtensions object for routing within a web application containing the ASP.NET Core Dashboard. The code snippet below shows how to add the required code to the Startup.cs file.

The api/dashboard prefix is used to handle requests from the client-side DashboardControl (the DashboardControlOptions.endpoint, DashboardBackendOptionsBuilder.Uri, and DashboardBackendOptions.Uri properties).

Expanded Enable CORS

You need to set up cross-origin resource sharing (CORS) on your back-end to configure corresponding permissions to access the HTML JavaScript Dashboard from a server at a different origin.

Call AddCors in the ConfigureServices method to add CORS services to the app's service container:

Add the CORS Middleware before you adds MVC and pass the url where the client side is hosted to the CorsPolicyBuilder.WithOrigins method:

In the example, the policy allows cross-origin requests from https://example.com and no other origins. Change this url to the url where the HTML JavaScript Dashboard is hosted.

Expanded Prepare a Dashboard Storage

The Web Dashboard requires creating a special dashboard storage. End-users can save new dashboards to this storage and open existing dashboards.

See Preparing a Dashboard Storage for details on how to create a dashboard storage for the ASP.NET MVC server side.

Expanded Register Default Data Sources

See Register Default Data Sources for details on how to supply end-users with a default data source set.

Expanded Register Default Data Connections

See Register Default Data Connections to learn how to provide a Web Dashboard with a predefined data connection set. The Dashboard Data Source Wizard displays these connections for end-users when creating new data sources.

Expanded See Also

Is this topic helpful?​​​​​​​