| name | syncfusion-aspnetmvc-security |
| description | **CONTENT SECURITY POLICY (CSP) GUIDE** — Assist with configuring Syncfusion ASP.NET MVC EJ2 components to work with strict Content Security Policy (CSP) headers. Use when: implementing CSP headers, applying nonces to inline scripts/styles, configuring external font allowlists, or troubleshooting CSP violations and XSS protections. |
| metadata | {"author":"Syncfusion Inc","version":"34.1.29","platform":"ASP.NET MVC"} |
Content Security Policy (CSP) — Syncfusion ASP.NET MVC (Security)
Use this skill for high-level, Syncfusion-specific CSP guidance and vulnerability-free configurations. Detailed implementation patterns and troubleshooting live in the concern's references files.
When to Use
- Implementing CSP headers for Syncfusion EJ2 controls in ASP.NET MVC
- Running in strict CSP mode where inline scripts/styles are restricted
- Blocking XSS, data injection, and other browser-based attacks
- Allowlisting CDN resources, external fonts, and trusted origins
- Validating and testing CSP compliance in development and production
- Troubleshooting CSP violation errors in browser console
ASP.NET MVC-Specific CSP Implementation
- Location: Meta tag in
~/Views/Shared/_Layout.cshtml head, or HTTP headers via IIS/code
- Scope: Applied globally to all views; can be overridden per view if needed
- Script Manager: Syncfusion's ScriptManager may require
unsafe-inline mitigation via nonces
Key CSP Directives for Syncfusion
Core Directives Required
default-src 'self' // Restrict all to same origin
script-src 'self' 'unsafe-inline' https://cdn.syncfusion.com // Scripts (inline needed for init)
style-src 'self' 'unsafe-inline' https://fonts.googleapis.com // Styles (inline for themes)
font-src 'self' data: https://fonts.gstatic.com https://fonts.googleapis.com // Fonts
Optional Directives
unsafe-eval (in script-src): Required ONLY if controls use templates (Grid, Dialog, etc.)
img-src: Add external CDN URLs if images hosted elsewhere
connect-src: For AJAX/fetch requests to data endpoints
Quick Checklist
✓ Add meta tag with strict CSP to _Layout.cshtml head
✓ Allow https://cdn.syncfusion.com for Syncfusion scripts/styles
✓ Allow https://fonts.googleapis.com and https://fonts.gstatic.com (Material/Tailwind themes)
✓ Include 'unsafe-inline' for style-src (Syncfusion uses inline styles for theming)
✓ Include 'unsafe-eval' in script-src ONLY if using template-based controls
✓ Test in browser DevTools (F12) → Console for CSP violations
✓ Monitor Content-Security-Policy-Report-Only for violation reports
✓ Avoid * wildcards; use explicit origins and 'self'
✓ Document any relaxations and security implications
Security Best Practices
- Nonce Strategy: Generate unique nonce per request; apply to inline scripts/styles
- Header vs Meta: Prefer HTTP header over meta tag for true enforcement
- Violation Reporting: Use
report-uri or report-to to monitor violations
- Development vs Production: Use
Content-Security-Policy-Report-Only in staging; validate before enforcing
- Third-party Scripts: Audit Syncfusion CDN and trusted sources regularly
- Minimize Inline Code: Refactor to external scripts where possible to reduce
unsafe-inline scope
Common Violations & Fixes
| Violation | Root Cause | Fix |
|---|
| Inline style blocked | Syncfusion theme styles | Add 'unsafe-inline' to style-src |
| Font load failed | External font from googleapis | Add https://fonts.googleapis.com to font-src, style-src |
| Script init failed | ScriptManager inline setup | Add 'unsafe-inline' to script-src or generate nonce |
| Template not rendering | Grid/Dialog template uses eval | Add 'unsafe-eval' to script-src (with caution) |
References