Een Content Security Policy (CSP) is een HTTP-header waarmee je bepaalt welke bronnen een browser mag laden op je website, zoals scripts, stylesheets en afbeeldingen. Hiermee verklein je het risico op cross-site scripting (XSS) en andere injectie-aanvallen aanzienlijk. In dit artikel lees je wat CSP precies doet, hoe je de header instelt via .htaccess of Plesk, en hoe je veelgemaakte fouten voorkomt.
Wat is een Content Security Policy
CSP is een beveiligingslaag die browsers vertelt van welke domeinen ze content mogen inladen. Zonder CSP kan een aanvaller via een kwetsbaarheid in je site kwaadaardige JavaScript injecteren, die dan zonder beperkingen wordt uitgevoerd. Met een goed ingestelde policy blokkeert de browser alles wat niet expliciet is toegestaan, ook al staat de malafide code al in de HTML.
De policy wordt meegestuurd als HTTP-response header Content-Security-Policy. Je kunt deze instellen op serverniveau, via een meta-tag in de HTML, of via je CMS. Voor de meeste websites is instellen op serverniveau het veiligst, omdat die niet door een gecompromitteerd script kan worden overschreven.
CSP-directives en voorbeelden
Een CSP bestaat uit directives die aangeven welk type content van welke bron mag komen. De belangrijkste zijn:
- default-src: standaardregel voor alle contenttypen als er geen specifiekere directive is.
- script-src: bepaalt waar JavaScript vandaan mag komen.
- style-src: bepaalt toegestane bronnen voor CSS.
- img-src: regelt afbeeldingen.
- font-src: regelt lettertypen.
- connect-src: regelt AJAX-, WebSocket- en fetch-verbindingen.
- frame-ancestors: bepaalt welke sites jouw pagina in een iframe mogen plaatsen.
Een eenvoudig voorbeeld dat alleen content van je eigen domein toestaat, met uitzondering voor Google Fonts:
Content-Security-Policy: default-src 'self'; style-src 'self' fonts.googleapis.com; font-src fonts.gstatic.com;
Content-Security-Policy-Report-Only) voordat je de echte header activeert. Zo zie je welke bronnen worden geblokkeerd zonder dat je site stuk gaat.CSP instellen op je server
Je kunt de CSP-header op verschillende manieren toevoegen, afhankelijk van je serverconfiguratie.
Via .htaccess
Voeg de volgende regel toe aan het .htaccess-bestand in de hoofdmap van je website: Header set Content-Security-Policy "default-src 'self';". Deze methode werkt direct op Apache en LiteSpeed-servers.
Via Plesk
Log in op Plesk, ga naar je domein en open Apache & nginx-instellingen. Daar kun je onder ‘Aanvullende directives’ de CSP-header handmatig toevoegen zonder dat je .htaccess hoeft te bewerken.
Via een meta-tag
Als je geen serverinstellingen kunt aanpassen, kun je de policy ook in de HTML zetten: <meta http-equiv="Content-Security-Policy" content="default-src 'self';">. Let op: hiermee kun je geen frame-ancestors of report-uri instellen.
Uitbreiden per contenttype
Voeg stap voor stap extra directives toe voor scripts, stijlen, afbeeldingen en lettertypen totdat alle functionaliteit van je site weer werkt, zonder dat je de policy te breed open hoeft te zetten.
Testen en veelgemaakte fouten
Test je policy altijd in de browserconsole; daar zie je direct welke bronnen worden geblokkeerd met een duidelijke foutmelding. Veelgemaakte fouten zijn:
- Het gebruik van
unsafe-inlinevoor scripts, wat de bescherming tegen XSS grotendeels teniet doet. - Vergeten dat externe diensten zoals analytics, chatwidgets of advertentienetwerken ook expliciet toegestaan moeten worden.
- Geen rekening houden met subdomeinen die losse regels nodig hebben.
- De policy direct live zetten zonder eerst te testen met Report-Only.
Controleer ook of je e-mailgerelateerde formulieren en ingebedde content, zoals die via zakelijke e-mail-widgets of contactformulieren, nog correct werken na het instellen van de policy. Loop je vast, raadpleeg dan de kennisbank voor meer configuratievoorbeelden of neem contact op met support.
Veelgestelde vragen
Breekt een CSP mijn website meteen?
Niet als je eerst test met Report-Only. Een verkeerd ingestelde policy kan scripts of stijlen blokkeren, dus controleer altijd de browserconsole voordat je live gaat.
Werkt CSP samen met een CDN?
Ja, voeg het domein van je CDN toe aan de relevante directives, bijvoorbeeld script-src of style-src, zodat bestanden van die bron wel worden toegestaan.
Is CSP verplicht voor een goede beveiligingsscore?
Niet verplicht, maar wel aan te raden. Het verkleint de impact van XSS-kwetsbaarheden en wordt door beveiligingsscanners vaak positief meegewogen.
Kan ik CSP combineren met gratis SSL?
Ja, CSP en SSL werken los van elkaar maar vullen elkaar goed aan: SSL beveiligt het transport, CSP beperkt welke content mag worden geladen.
Moet ik CSP instellen voor mijn domeinnaam of per subdomein?
Per subdomein apart, omdat elk subdomein zijn eigen headers en configuratie kan hebben. Beheer je meerdere domeinnamen, stel dan voor elk domein een passende policy in.
Conclusie
Een Content Security Policy is een krachtige maar nauwkeurige manier om je website te beschermen tegen XSS en ongewenste content. Begin met Report-Only, bouw de policy stap voor stap op per directive en test grondig voordat je live gaat. Zo voorkom je dat legitieme functionaliteit wordt geblokkeerd.