DashboardBuilder.Nonce(String) Method

Specifies the nonce value.

Namespace: DevExpress.DashboardAspNetCore

Assembly: DevExpress.Dashboard.v24.2.AspNetCore.dll

Declaration

C#

public DashboardBuilder Nonce(
    string nonce
)

VB.NET

Public Function Nonce(
    nonce As String
) As DashboardBuilder

Parameters

Name	Type	Description
nonce	String	A String that specifies the nonce value.

Returns

Type	Description
DashboardBuilder	A reference to this instance after the operation has completed.

Example

The following example shows how to implement a nonce-based Content Security Policy (CSP) for an ASP.NET Core Application with Razor Pages through a HTTP response header:

View Example

In a page model, generate the nonce value. In this example, the RandomNumberGenerator class is used to generate cryptographically strong random values.

using System.Security.Cryptography;
//...
public string Nonce { get; set; }
public DashboardModel() {
    var nonceBytes = new byte[32];
    using var generator = RandomNumberGenerator.Create();
    generator.GetBytes(nonceBytes);
    Nonce = Convert.ToBase64String(nonceBytes);
}

In the OnGet handler method, add a HTTP header with the Content Security Policy with the nonce for script-src and style-src directives:

public IActionResult OnGet() {
    HttpContext.Response.Headers.Add("Content-Security-Policy",
        "img-src data: https: http:;" +
        string.Format("script-src 'self' 'nonce-{0}';", Nonce) +
        string.Format("style-src 'self' 'nonce-{0}';", Nonce) 
            );
    return Page();
}

The new nonce value is generated each time the page loads.

In the Index.cshtml file, add the @model directive and pass the nonce value to Nonce method:

@page
@model CSPDashboardExample.Models.DashboardModel

<div class="my-dashboard-container">
@(Html.DevExpress().Dashboard("dashboardControl1")
    .ControllerName("DefaultDashboard")
    .Nonce(Model.Nonce)
    .Width(null)
    .Height(null)
    .OnBeforeRender("onBeforeRender")
)
</div>

Note

Set the Height and Width properties to null for the application to work properly. You can specify the required height and width in a CSS class.