Content Security Policy

All Kendo UI for Angular components comply with the strict Content Security Policy (CSP) standards. This article describes in more detail how the strict CSP mode can affect the Kendo UI for Angular suite and what policy configuration your application may need in some scenarios.

Strict Content Security Policy(CSP) and What it Affects

If a strict CSP mode is enabled, some browser features are disabled, such as:

• Inline JavaScript in the form of <script> tags or legacy DOM attributes such as onclick, are blocked. All script code must live in separate files, served from a whitelisted domain.
• Inline CSS in the form of <style> tags and style attributes.
• Fonts and images from Base64 data: portions in stylesheets.
• Dynamic code evaluation via eval().

Policy Configuration

These limitations can affect the Kendo UI for Angular components, because they need the following:

• To enable the loading of font icons, allow 'data:' sources for font-src. Since v14.0.0, introduced in the R3 2023 (October 2023) release, the Kendo UI for Angular components use SVG icons by default.

• If you use our CDN, you must also allow it as a source for stylesheets.

  html

  <meta http-equiv="Content-Security-Policy" content="
        style-src 'self' 'unsafe-inline' https://kendo.cdn.telerik.com;
        style-src-elem 'self' 'unsafe-inline' https://kendo.cdn.telerik.com;
        font-src 'self' data:;
        img-src 'self' data:"
  />

• Allow 'unsafe-inline' for style-src to enable Angular components to load encapsulated styles when using the Editor in encapsulated mode.

  Since version 17.0.0, the Kendo UI for Angular Spreadsheet supports strict CSP compliance. The only exception is when using the defineFunction(name, func) method of the component. In this case, allow 'unsafe-eval' for script-src.

A sample application is available on the Kendo UI for Angular public GitHub repo.

To enable CSP, your application needs to use Ahead of Time Compilation (AOT). The Just-in-Time (JIT) compiler is not suitable as it generates dynamic scripts at runtime.