New to Kendo UI for Angular? Start a free 30-day trial

Content Security Policy

If a strict Content-Security-Policy (CSP) mode is enabled, some browser features are disabled, such as:

  • Inline JavaScript in the form of <script> tags or element attributes like onclick, are blocked. All script code must reside in separate files, served from a whitelisted domain.
  • Fonts and images from Base64 data: portions in stylesheets.

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

  • Allow 'data:' sources for font-src to enable the loading of font icons.
  • If you use our CDN, you must also allow it as a source for stylesheets.
<meta http-equiv="Content-Security-Policy" content="
      style-src 'self' 'unsafe-inline';
      style-src-elem 'self' 'unsafe-inline';
      font-src 'self' data:;
      img-src 'self' data:" />
  • Allow 'unsafe-inline' for style-src to enable Angular components to load encapsulated styles when:

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.

In this article

Not finding the help you need?