A Content Security Policy (CSP) is an HTTP header that determines which resources a browser is allowed to load on your website, such as scripts, stylesheets, and images. This significantly reduces the risk of cross-site scripting (XSS) and other injection attacks. In this article you’ll learn exactly what CSP does, how to set the header via .htaccess or Plesk, and how to avoid common mistakes.
What is a Content Security Policy
CSP is a security layer that tells browsers from which domains they’re allowed to load content. Without CSP, an attacker can exploit a vulnerability in your site to inject malicious JavaScript, which is then executed without restrictions. With a properly configured policy, the browser blocks everything that isn’t explicitly allowed, even if the malicious code is already present in the HTML.
The policy is sent as the HTTP response header Content-Security-Policy. You can set it at the server level, via a meta tag in the HTML, or through your CMS. For most websites, setting it at the server level is the safest option, since it can’t be overwritten by a compromised script.
CSP directives and examples
A CSP consists of directives that specify which type of content is allowed from which source. The most important ones are:
- default-src: default rule for all content types if no more specific directive applies.
- script-src: determines where JavaScript may come from.
- style-src: determines allowed sources for CSS.
- img-src: controls images.
- font-src: controls fonts.
- connect-src: controls AJAX, WebSocket, and fetch connections.
- frame-ancestors: determines which sites are allowed to place your page in an iframe.
A simple example that only allows content from your own domain, with an exception for Google Fonts:
Content-Security-Policy: default-src 'self'; style-src 'self' fonts.googleapis.com; font-src fonts.gstatic.com;
Content-Security-Policy-Report-Only) before activating the actual header. This way you can see which sources are being blocked without breaking your site.Setting up CSP on your server
You can add the CSP header in several ways, depending on your server configuration.
Via .htaccess
Add the following line to the .htaccess file in your website’s root folder: Header set Content-Security-Policy "default-src 'self';". This method works directly on Apache and LiteSpeed servers.
Via Plesk
Log in to Plesk, go to your domain, and open Apache & nginx Settings. There you can add the CSP header manually under ‘Additional directives’ without needing to edit your .htaccess file.
Via a meta tag
If you can’t adjust server settings, you can also place the policy in the HTML: <meta http-equiv="Content-Security-Policy" content="default-src 'self';">. Note: this doesn’t allow you to set frame-ancestors or report-uri.
Expanding per content type
Add extra directives step by step for scripts, styles, images, and fonts until all functionality on your site works again, without having to open the policy too broadly.
Testing and common mistakes
Always test your policy in the browser console; there you’ll immediately see which sources are being blocked, along with a clear error message. Common mistakes include:
- Using
unsafe-inlinefor scripts, which largely negates the protection against XSS. - Forgetting that external services such as analytics, chat widgets, or ad networks also need to be explicitly allowed.
- Not accounting for subdomains that need their own separate rules.
- Putting the policy live immediately without first testing with Report-Only.
Also check whether email-related forms and embedded content, such as widgets via business email or contact forms, still work correctly after setting the policy. If you get stuck, consult the knowledge base for more configuration examples or contact support.
Frequently Asked Questions
Will a CSP break my website immediately?
Not if you test first with Report-Only. An incorrectly configured policy can block scripts or styles, so always check the browser console before going live.
Does CSP work together with a CDN?
Yes, add your CDN’s domain to the relevant directives, such as script-src or style-src, so files from that source are allowed.
Is CSP required for a good security score?
Not required, but recommended. It reduces the impact of XSS vulnerabilities and is often weighed positively by security scanners.
Can I combine CSP with free SSL?
Yes, CSP and SSL operate independently but complement each other well: SSL secures the transport, CSP restricts which content may be loaded.
Should I set up CSP for my domain name or per subdomain?
Per subdomain separately, since each subdomain can have its own headers and configuration. If you manage multiple domain names, set up an appropriate policy for each domain.
Conclusion
A Content Security Policy is a powerful but precise way to protect your website against XSS and unwanted content. Start with Report-Only, build the policy step by step per directive, and test thoroughly before going live. This way you prevent legitimate functionality from being blocked.