syncfusion-blazor-security logo

syncfusion-blazor-security

syncfusion blazor security

SKILL.md

Full skill instructions

Syncfusion Blazor Security

Content Security Policy (CSP) configuration for Syncfusion Blazor components in browser-hosted applications (.NET 8, 9, 10).

When to Use

Use this skill when you need to:

  • Add a CSP <meta> tag to App.razor or index.html for Syncfusion components
  • Configure CSP for self-hosted (Static Web Assets) script and style delivery
  • Configure CSP for CDN-hosted Syncfusion scripts and styles
  • Understand which CSP directives Syncfusion components require and why

Quick Reference

Required CSP Directives at a Glance

DirectiveValueReason
font-src'self' data:Base64-encoded icon fonts
style-src'self' 'unsafe-inline'Inline styles for sizing/positioning
script-src'self'Dynamic code evaluation (animations, etc.)
connect-src'self' https: wss:WebSocket and HTTPS connections
img-srcdata: https:Inline images and remote assets
object-src'none'Block plugin content

CDN users: also append https://cdn.syncfusion.com/blazor/ to script-src and style-src.

Where to Add the CSP Tag

Project TypeFile
Blazor Web App (.NET 8/9/10) any render mode~/Components/App.razor
Blazor WebAssembly Standalonewwwroot/index.html