diff --git a/11055b05-7c03-48f2-b4ad-e978980dba67/draft_overlay.json b/11055b05-7c03-48f2-b4ad-e978980dba67/draft_overlay.json deleted file mode 100644 index d29d675..0000000 --- a/11055b05-7c03-48f2-b4ad-e978980dba67/draft_overlay.json +++ /dev/null @@ -1,12 +0,0 @@ -{ - "title": "En-têtes HTTP : CSP ou comment sécuriser le contenu d'un site web", - "_updated_at": "2026-05-16 17:26:19", - "slug": "20230111-en-tetes-http-csp-securiser-le-contenu-d-un-site-web", - "published": true, - "published_at": "2023-01-11 17:32", - "category": "Journal geek", - "tags": [], - "seo_title": "", - "seo_description": "", - "og_image": "https://www.abonnel.fr/file?uuid=11055b05-7c03-48f2-b4ad-e978980dba67&name=cover.png" -} diff --git a/11055b05-7c03-48f2-b4ad-e978980dba67/draft_overlay.md b/11055b05-7c03-48f2-b4ad-e978980dba67/draft_overlay.md deleted file mode 100644 index 9090f95..0000000 --- a/11055b05-7c03-48f2-b4ad-e978980dba67/draft_overlay.md +++ /dev/null @@ -1,60 +0,0 @@ -# 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 `` : - -``` -Header always set Content-Security-Policy "default-src 'self'; script-src 'self'; img-src 'self' https:; child-src 'none';" -``` - -**2. Via une balise `` dans le HTML**, utile lorsqu'on n'a pas la main sur le serveur : - -```html - -``` - -> 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* \ No newline at end of file diff --git a/11055b05-7c03-48f2-b4ad-e978980dba67/index.md b/11055b05-7c03-48f2-b4ad-e978980dba67/index.md index 7e8aa09..9090f95 100644 --- a/11055b05-7c03-48f2-b4ad-e978980dba67/index.md +++ b/11055b05-7c03-48f2-b4ad-e978980dba67/index.md @@ -1,41 +1,60 @@ # En-têtes HTTP : CSP ou comment sécuriser le contenu d'un site web -![](csp.png) +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. -Les CSP (Content Security Policy) sont des en-têtes HTTP qui permettent de définir les règles de sécurité pour le contenu d'un site Web. Elles sont utilisées pour aider à protéger le site et ses utilisateurs contre diverses attaques de sécurité, telles que l'injection de code malveillant ou la fuite de données sensibles. +## Comment l'activer -Pour activer CSP, vous devez configurer vos serveurs web afin d'ajouter un en-tête (header) aux réponses. Dans une configuration Apache, en fichier .htaccess ou dans une balise "Location", par exemple : +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 `` : ``` -Header always set Content-Security-Policy "default-src 'self'; scriptimg-src 'self' https:**; child-src 'none';" +Header always set Content-Security-Policy "default-src 'self'; script-src 'self'; img-src 'self' https:; child-src 'none';" ``` -Une autre possibilité consiste à utiliser l'élément HTML `` pour configurer la règle. +**2. Via une balise `` dans le HTML**, utile lorsqu'on n'a pas la main sur le serveur : -``` - +```html + ``` -Il existe de nombreuses directives que vous pouvez utiliser pour définir des règles de sécurité précises afin de : -- Empêcher les écoutes du trafic -- Réduire des attaques cross site scripting (XSS) +> 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. -Voici comment utiliser les CSP dans un site Web. +## Les directives à connaître -Définissez les règles de sécurité que vous souhaitez appliquer à votre site. Par exemple, vous pouvez spécifier quelles sources de contenu (scripts, images, etc.) sont autorisées à être chargées sur votre site. Voir la page du W3C des[directives pour contrôler les ressources que l'agent utilisateur est autorisé à charger pour une page donnée](https:*developer.mozilla.org/fr/docs/Web/HTTP/Headers/Content-Security-Policy). +Une CSP se compose d'une liste de **directives**, chacune contrôlant un type de ressource : -Ajoutez l'en-tête HTTP `Content-Security-Policy` à votre site. Vous pouvez le faire soit en modifiant le fichier `.htaccess` de votre serveur, soit en ajoutant l'en-tête directement dans le code HTML de votre site. +- `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. - Content-Security-Policy: règle +Chaque directive accepte des valeurs comme `'self'` (même origine), `'none'` (rien), une URL, ou des mots-clés comme `'unsafe-inline'` (à éviter). -Définissez la valeur de l'en-tête Content-Security-Policy en spécifiant les règles de sécurité que vous avez définies. Par exemple : +La liste complète est documentée sur [MDN : Content-Security-Policy](https://developer.mozilla.org/fr/docs/Web/HTTP/Headers/Content-Security-Policy). - Content-Security-Policy: default-src 'self'; script-src 'self' https:*example.com; img-src 'self' https:*example.com; +## Exemple commenté -Cet exemple autorise le chargement de contenu uniquement à partir de la même origine que le site ('self') pour le contenu par défaut (`default-src`) et les scripts (`script-src`), tandis que les images (`img-src`) peuvent être chargées à partir de l'origine du site ou de l'URL `https:*example.com`. +``` +Content-Security-Policy: default-src 'self'; script-src 'self' https://example.com; img-src 'self' https://example.com; +``` -## Versions, crédits et 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) +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* \ No newline at end of file diff --git a/11055b05-7c03-48f2-b4ad-e978980dba67/meta.json b/11055b05-7c03-48f2-b4ad-e978980dba67/meta.json index 25fe0d1..0c5c183 100644 --- a/11055b05-7c03-48f2-b4ad-e978980dba67/meta.json +++ b/11055b05-7c03-48f2-b4ad-e978980dba67/meta.json @@ -4,15 +4,24 @@ "title": "En-têtes HTTP : CSP ou comment sécuriser le contenu d'un site web", "author": "cedric@abonnel.fr", "published": true, - "published_at": "2023-01-11 17:32:01", + "featured": false, + "published_at": "2023-01-11 17:32", "created_at": "2023-01-11 17:32:01", - "updated_at": "2023-01-11 17:32:01", - "revisions": [], + "updated_at": "2026-05-16 17:26:21", + "revisions": [ + { + "n": 1, + "date": "2026-05-16 17:26:21", + "comment": "Contenu modifié, image de couverture modifiée", + "title": "En-têtes HTTP : CSP ou comment sécuriser le contenu d'un site web" + } + ], "cover": "cover.png", "files_meta": [], "external_links": [], "seo_title": "", "seo_description": "", - "og_image": "", - "category": "Journal geek" + "og_image": "https://www.abonnel.fr/file?uuid=11055b05-7c03-48f2-b4ad-e978980dba67&name=cover.png", + "category": "Journal geek", + "tags": [] } diff --git a/11055b05-7c03-48f2-b4ad-e978980dba67/revisions/0001.md b/11055b05-7c03-48f2-b4ad-e978980dba67/revisions/0001.md new file mode 100644 index 0000000..7e8aa09 --- /dev/null +++ b/11055b05-7c03-48f2-b4ad-e978980dba67/revisions/0001.md @@ -0,0 +1,41 @@ +# En-têtes HTTP : CSP ou comment sécuriser le contenu d'un site web + +![](csp.png) + +Les CSP (Content Security Policy) sont des en-têtes HTTP qui permettent de définir les règles de sécurité pour le contenu d'un site Web. Elles sont utilisées pour aider à protéger le site et ses utilisateurs contre diverses attaques de sécurité, telles que l'injection de code malveillant ou la fuite de données sensibles. + +Pour activer CSP, vous devez configurer vos serveurs web afin d'ajouter un en-tête (header) aux réponses. Dans une configuration Apache, en fichier .htaccess ou dans une balise "Location", par exemple : + +``` +Header always set Content-Security-Policy "default-src 'self'; scriptimg-src 'self' https:**; child-src 'none';" +``` + +Une autre possibilité consiste à utiliser l'élément HTML `` pour configurer la règle. + +``` + +``` + +Il existe de nombreuses directives que vous pouvez utiliser pour définir des règles de sécurité précises afin de : +- Empêcher les écoutes du trafic +- Réduire des attaques cross site scripting (XSS) + +Voici comment utiliser les CSP dans un site Web. + +Définissez les règles de sécurité que vous souhaitez appliquer à votre site. Par exemple, vous pouvez spécifier quelles sources de contenu (scripts, images, etc.) sont autorisées à être chargées sur votre site. Voir la page du W3C des[directives pour contrôler les ressources que l'agent utilisateur est autorisé à charger pour une page donnée](https:*developer.mozilla.org/fr/docs/Web/HTTP/Headers/Content-Security-Policy). + +Ajoutez l'en-tête HTTP `Content-Security-Policy` à votre site. Vous pouvez le faire soit en modifiant le fichier `.htaccess` de votre serveur, soit en ajoutant l'en-tête directement dans le code HTML de votre site. + + Content-Security-Policy: règle + +Définissez la valeur de l'en-tête Content-Security-Policy en spécifiant les règles de sécurité que vous avez définies. Par exemple : + + Content-Security-Policy: default-src 'self'; script-src 'self' https:*example.com; img-src 'self' https:*example.com; + +Cet exemple autorise le chargement de contenu uniquement à partir de la même origine que le site ('self') pour le contenu par défaut (`default-src`) et les scripts (`script-src`), tandis que les images (`img-src`) peuvent être chargées à partir de l'origine du site ou de l'URL `https:*example.com`. + +## Versions, crédits et 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* \ No newline at end of file