CSP after applying "script-src 'self' " Kendo control doesn't work

[Sachin]

In CSP we were using script-src 'self' 'unsafe-inline' 

but for security purpose need to remove 'unsafe-inline' , we added  'nonce-a9f04fd1-06cf-4948-9d66-ea306e581896' for inline script.

applied nonce for inline script 

<script type="text/javascript" nonce="a9f04fd1-06cf-4948-9d66-ea306e581896">

</script>

but after applying these change kendo  controls not working. Our assumption is there are dynamic inline scripts generated  for kendo controls which not contains nonce. so it may cause an issue.

we also tried DeferredScripts but no success. after applying 'unsafe-inline'  it works.

<script type="text/javascript" nonce="a9f04fd1-06cf-4948-9d66-ea306e581896">

    @Html.Kendo().DeferredScripts()

</script>

 

Please suggest as we want to remove 'unsafe-inline' with kendo controls need to work.

 

[Ivan Danchev]

Hello Sachin,

See this article, which describes the necessary settings: https://docs.telerik.com/aspnet-mvc/troubleshoot/troubleshooting-content-security-policy

In addition to deferring the components and setting the nonce attribute value of the script tag:

<script type="text/javascript" nonce="kendoInlineScript">

the value of the meta tag content attribute must be set accordingly as well:

<meta http-equiv="Content-Security-Policy" content="script-src 'unsafe-eval' 'self' 'nonce-kendoInlineScript' https://kendo.cdn.telerik.com;">

Regards,
Ivan Danchev
Progress Telerik

[Sachin]

Hi Ivan,

Thanks for reply and suggestions.

We are able to remove 'unsafe-inline' from CSP and kendo controls working fine with 'unsafe-eval'.

We need to remove all 'unsafe-' Prefixed Directives from CSP.  How we can remove 'unsafe-eval' dependency with kendo ?

We have found on update from Telerik (Kendo)  that 'unsafe-eval' will fixed in next year release.

CSP Support (telerik.com)

Please suggest.

[Ivan Danchev]

Yes, we are still working on the CSP support and we expect to be ready with that for the R1 2023 release. The release is due the third week of January. 

[Sachin]

Hi Ivan,

Any update on R1 2023 release for removing 'unsafe-eval' dependency with kendo.

[Ivan Danchev]

With R1 2023 we released a new template syntax, which allows using the Kendo UI for jQuery components without adding "unsafe-eval". For more details, see this section of the documentation: https://docs.telerik.com/kendo-ui/intro/widget-basics/content-security-policy#for-r1-2023-and-later-working-with-kendo-ui-for-jquery

We are still working on the CSP support for the MVC and Core helpers, which is why currently they still depend on "unsafe-eval". We expect the improvements to be included in the R1 2023 SP1 release in mid March.

[Sachin]

Hi Ivan,

Any update on R1 2023 SP1 release in mid March for removing 'unsafe-eval' dependency with kendo for MVC?

[Ivan Danchev]

Hi Sachin,

We are on track with the CSP improvements for UI for ASP.NET MVC and plan on including them in the R1 2023 SP1 release, which is coming next week.

[Sachin]

Hi Ivan

Any update on R1 2023 SP1 release in mid March for removing 'unsafe-eval' dependency with kendo for MVC?

[Sachin]

Hi Ivan

Awaiting your response

[Ivan Danchev]

Hi Sachin,

The documentation was updated with more information about the CSP support after the R1 2023 SP1. See the following section for more details on the new features introduced with this release, which allow you to remove 'unsafe-eval': https://docs.telerik.com/aspnet-mvc/html-helpers/helper-basics/content-security-policy#for-r1-2023-sp1-and-later-working-with-telerik-ui-for-aspnet-mvc-components

 

[Sachin]

Hi Ivan,

We are implementing new release for Kendo MVC for CSP changes. We removed unsafe-eval

below is sample code

CommonFunctions.BindFileroomGridColumn<FileroomModel, string>(
            columns: columns,
            bindExpression: p => p.BinderLevelButtons,
            clientTemplate: "",
            headerTemplate: "Options",
            isFilterable: false,
            isGroupable: false,
            isSortable: false,
            title: "",
            width: "80px",
            headerHtmlAttr: new { @class = "disable-resize", data_columnname = "binderlevelbuttons" },
            htmlAttr: new { @class = "binderbtn", data_columnname = "binderlevelbuttons",data_binderid = "#= BinderID #", data_isaccess = "#= E_Access #" },
            totalWidth: ref totalWidth);

Setting in .HtmlAttributes

When grid is loaded

we are not getting value of column binderid value, before removing unsafe-eval it was working

Before Removing unsafe-Eval

After Removing Unsafe-Eval

Please suggest

[Ivan Danchev]

Hi Sachin,

For issues with the Grid, please submit a ticket with product Grid / UI for ASP.NET MVC in the ticketing system: https://www.telerik.com/account/support-center/contact-us/submit-ticket

 

[Phạm]

Hi Ivan.

Is this solution still working in Telerik UI for ASP.NET MVC 2024 Q2 release? I'm having the same problem, the kendo ui control components is generating inline scripts which not contain nonce. Does adding 'https://kendo.cdn.telerik.com' into Content-Security_Policy header solving this problem instead of 'unsafe-inline' ?

Looking forward to receiving your reply.

Thanks

[Ivan Danchev]

Hi Phạm,

The article linked above is still valid. To ensure CSP compatibility, defer the components as explained in this section: https://docs.telerik.com/aspnet-mvc/html-helpers/helper-basics/content-security-policy#deferring-scripts-to-file

The meta tag can be set like this:

<meta http-equiv="Content-Security-Policy" content="default-src 'self'; img-src 'self' data:; script-src 'self' https://cdn.kendostatic.com/ https://kendo.cdn.telerik.com https://code.jquery.com/ 'nonce-Telerik-CSP-Examples'; style-src 'self' https://kendo.cdn.telerik.com; font-src 'self' data:;" />

You can then use the nonce value as shown below when deferring the scripts:

<script type="text/javascript" nonce="Telerik-CSP-Examples">
    @Html.Kendo().DeferredScripts(false)
</script>