Cédrix
60 lines
3.0 KiB
Markdown
60 lines
3.0 KiB
Markdown
# En-têtes HTTP : CSP ou comment sécuriser le contenu d'un site web
|
|
|
|
La **Content Security Policy** (CSP) est un en-tête HTTP qui permet de déclarer au navigateur quelles sources de contenu sont autorisées sur une page : scripts, images, styles, iframes, etc. Bien configurée, elle constitue l'une des défenses les plus efficaces contre les attaques de type **cross-site scripting (XSS)** et l'injection de ressources tierces non désirées.
|
|
|
|
## Comment l'activer
|
|
|
|
Deux méthodes principales permettent de déclarer une CSP.
|
|
|
|
**1. Via la configuration du serveur** (recommandé). Sur Apache, dans un `.htaccess` ou un bloc `<Location>` :
|
|
|
|
```
|
|
Header always set Content-Security-Policy "default-src 'self'; script-src 'self'; img-src 'self' https:; child-src 'none';"
|
|
```
|
|
|
|
**2. Via une balise `<meta>` dans le HTML**, utile lorsqu'on n'a pas la main sur le serveur :
|
|
|
|
```html
|
|
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; img-src 'self' https:; child-src 'none';">
|
|
```
|
|
|
|
> Astuce : avant de passer en production, utilisez l'en-tête `Content-Security-Policy-Report-Only`. Le navigateur signalera les violations sans bloquer le contenu, ce qui permet d'ajuster les règles sans casser le site.
|
|
|
|
## Les directives à connaître
|
|
|
|
Une CSP se compose d'une liste de **directives**, chacune contrôlant un type de ressource :
|
|
|
|
- `default-src` — valeur par défaut pour toutes les autres directives.
|
|
- `script-src` — sources autorisées pour le JavaScript.
|
|
- `style-src` — sources autorisées pour le CSS.
|
|
- `img-src` — sources autorisées pour les images.
|
|
- `connect-src` — destinations autorisées pour `fetch`, `XMLHttpRequest`, WebSocket.
|
|
- `frame-ancestors` — sites autorisés à embarquer la page dans une iframe (remplace `X-Frame-Options`).
|
|
- `child-src` — sources autorisées pour les iframes et workers.
|
|
|
|
Chaque directive accepte des valeurs comme `'self'` (même origine), `'none'` (rien), une URL, ou des mots-clés comme `'unsafe-inline'` (à éviter).
|
|
|
|
La liste complète est documentée sur [MDN : Content-Security-Policy](https://developer.mozilla.org/fr/docs/Web/HTTP/Headers/Content-Security-Policy).
|
|
|
|
## Exemple commenté
|
|
|
|
```
|
|
Content-Security-Policy: default-src 'self'; script-src 'self' https://example.com; img-src 'self' https://example.com;
|
|
```
|
|
|
|
Cette politique autorise :
|
|
- tout contenu par défaut uniquement depuis la même origine ;
|
|
- les scripts depuis l'origine du site **et** `https://example.com` ;
|
|
- les images depuis l'origine du site **et** `https://example.com`.
|
|
|
|
Tout le reste est bloqué par le navigateur.
|
|
|
|
## Précautions
|
|
|
|
Une CSP trop restrictive peut casser un site en bloquant des ressources légitimes (analytics, polices, widgets tiers). Procédez par étapes : commencez en mode `Report-Only`, analysez les rapports de violation, puis durcissez progressivement la politique.
|
|
|
|
## Ressources
|
|
- [W3C : Content Security Policy Level 3](https://www.w3.org/TR/CSP3/)
|
|
- [Mozilla : Content Security Policy](https://developer.mozilla.org/fr/docs/Web/HTTP/CSP)
|
|
|
|
Crédit image : *Midjourney* |