Content Security Policy

This article describes how the Kendo UI for Angular suite conforms to string Content Security Policy (CSP) and what policy configuration it may need.

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

  Copy Code<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.

• Allow 'unsafe-eval' for script-src when using the Spreadsheet component. The primary engine of the Kendo UI for Angular Spreadsheet relies on evaluating functions using the Function() method. Modifying the component's logic would result in many significant breaking changes. The rest of the Kendo UI for Angular components and internal processes have been redesigned to eliminate the need for eval() and new Function() calls.

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.