path: root/files/fr/web/http/headers/content-security-policy/index.html

---
title: Politique de sécurité de contenu
slug: Web/HTTP/Headers/Content-Security-Policy
tags:
  - CSP
  - HTTP
  - Référence(2)
  - Sécurité
  - en-tête
translation_of: Web/HTTP/Headers/Content-Security-Policy
---
<div>{{HTTPSidebar}}</div>

<p>L'en-tête de réponse HTTP <strong><code>Content-Security-Policy</code></strong> permet aux administrateurs d'un site web de contrôler les ressources que l'agent utilisateur est autorisé à charger pour une page donnée. Bien qu'il y ait quelques exceptions, ces règles impliquent la plupart du temps de définir les origines du serveur et les points d'accès pour les scripts. Cet en-tête aide à se protéger contre les attaques de <em>cross-site scripting</em> ({{Glossary("XSS")}}).</p>

<p>Pour plus d'informations, voir cet article sur <a href="/fr/docs/Web/HTTP/CSP"><em>Content Security Policy</em> (CSP)</a>.</p>

<table class="properties">
 <tbody>
  <tr>
   <th scope="row">Type d'en-tête</th>
   <td>En-tête de réponse</td>
  </tr>
  <tr>
   <th scope="row">Nom d'en-tête interdit</th>
   <td>Non</td>
  </tr>
 </tbody>
</table>

<h2 id="Syntaxe">Syntaxe</h2>

<pre class="syntaxbox notranslate">Content-Security-Policy: &lt;policy-directive&gt;; &lt;policy-directive&gt;
</pre>

<h2 id="Directives">Directives</h2>

<h3 id="Directives_de_récupération_fetch">Directives de récupération (<em>fetch</em>)</h3>

<p>Les directives de récupération (ou <em>fetch directives</em> en anglais) contrôlent les emplacements à partir desquels certains types de ressource peuvent être chargés.</p>

<dl>
 <dt>{{CSP("child-src")}}</dt>
 <dd>Définit les sources valides pour les <a href="/fr/docs/Web/API/Web_Workers_API">web workers</a> et les éléments qui représentent des contextes de navigation imbriqués tels que {{HTMLElement("frame")}} et {{HTMLElement("iframe")}}.</dd>
</dl>

<div class="blockIndicator warning">Plutôt que la directive <strong><code>child-src</code></strong>, si vous souhaitez réguler les contextes de navigation imbriqués et les workers séparément, vous pouvez utiliser respectivement les directives {{CSP("frame-src")}} et {{CSP("worker-src")}}.</div>

<dl>
 <dt>{{CSP("connect-src")}}</dt>
 <dd>Restreint les URL qui peuvent être chargées via des scripts.</dd>
 <dt>{{CSP("default-src")}}</dt>
 <dd>Représente la valeur par défaut des directives de récupération qui ne sont pas définies explicitement.</dd>
 <dt>{{CSP("font-src")}}</dt>
 <dd>Définit les sources valides pour les polices de caractères chargées depuis {{cssxref("@font-face")}}.</dd>
 <dt>{{CSP("frame-src")}}</dt>
 <dd>Définit les sources valides pour les éléments qui représentent des contextes de navigation imbriqués, tels que {{HTMLElement("frame")}} et {{HTMLElement("iframe")}}.</dd>
 <dt>{{CSP("img-src")}}</dt>
 <dd>Définit les sources valides pour les images et les favicons.</dd>
 <dt>{{CSP("manifest-src")}}</dt>
 <dd>Définit les sources valides pour les fichiers de manifeste d'application.</dd>
 <dt>{{CSP("media-src")}}</dt>
 <dd>Définit les sources valides pour les ressources média des éléments {{HTMLElement("audio")}} et {{HTMLElement("video")}}.</dd>
 <dt>{{CSP("object-src")}}</dt>
 <dd>Définit les sources valides pour les ressources des éléments {{HTMLElement("object")}}, {{HTMLElement("embed")}} et {{HTMLElement("applet")}}.</dd>
</dl>

<div class="blockIndicator note">
<p>Les éléments contrôlés pa ar <code>object-src</code> sont considérés peut-être par coïcidence comme des éléments HTML du passé et ne recevront de nouvelles fonctionnalités normalisées (comme les attributs de sécurité <code>sandbox</code> et <code>allow</code> pour <code>&lt;iframe&gt;</code>). De ce fait, il est <strong>recommandé</strong> de restreindre cette directive, c'est-à-dire la définir explicitement à <code>object-src 'none'</code> dans la mesure du possible.</p>
</div>

<dl>
 <dt>{{CSP("prefetch-src")}}</dt>
 <dd>Définit .</dd>
 <dt>{{CSP("script-src")}}</dt>
 <dd>Définit les sources valides pour les fichiers JavaScript.</dd>
 <dt>{{CSP("script-src-elem")}}{{experimental_inline}}</dt>
 <dd>Définit les sources valides de code JavaScript chargé avec l'élément {{HTMLElement("script")}}.</dd>
 <dt>{{CSP("script-src-attr")}}{{experimental_inline}}</dt>
 <dd>Définit les sources valides de JavaScript pour les écouteurs d'évènements par les attributs <code>on&lt;eventName&gt;</code>.</dd>
 <dt>{{CSP("style-src")}}</dt>
 <dd>Définit les sources valides pour les feuilles de styles.</dd>
 <dt>{{CSP("style-src-elem")}}{{experimental_inline}}</dt>
 <dd>Définit les sources valides pour les feuilles de styles définies avec l'élément {{HTMLElement("style")}} ou chargées avec l'élément {{HTMLElement("link")}} ayant l'attribut <code>rel="stylesheet"</code>.</dd>
 <dt>{{CSP("style-src-attr")}}{{experimental_inline}}</dt>
 <dd>Définit les sources valides pour les feuilles de styles embarquées appliquées à des éléments individuels du DOM par l'attribut <code>style</code>.</dd>
 <dt>{{CSP("worker-src")}}</dt>
 <dd>Définit les sources valides pour les scripts des {{domxref("Worker")}}, {{domxref("SharedWorker")}} et {{domxref("ServiceWorker")}}.</dd>
</dl>

<h3 id="Directives_de_document">Directives de document</h3>

<p>Les directives de document permettent de paramétrer les propriétés d'un document ou d'un environnement pour <a href="/fr/docs/Web/API/Web_Workers_API">un <em>web worker</em></a> auquel une règle de sécurité s'applique.</p>

<dl>
 <dt>{{CSP("base-uri")}}</dt>
 <dd>Restreint les URL qui peuvent être utilisées au sein de l'élément {{HTMLElement("base")}} d'un document.</dd>
 <dt>{{CSP("plugin-types")}}</dt>
 <dd>Restreint le type de plugin qui peut être intégré dans un document en limitant le type de ressource qui peut être chargé.</dd>
 <dt>{{CSP("sandbox")}}</dt>
 <dd>Active un bac-à-sable (<em>sandbox</em>) pour la ressource visée. Cela fonctionne de façon analogue à l'attribut {{htmlattrxref("sandbox", "iframe")}} de {{HTMLElement("iframe")}}.</dd>
</dl>

<h3 id="Directives_de_navigation">Directives de navigation</h3>

<p>Les directives de navigation permettent par exemple de paramétrer les emplacements vers lesquels l'utilisateur peut naviguer ou envoyer un formulaire.</p>

<dl>
 <dt>{{CSP("form-action")}}</dt>
 <dd>Restreint les URL qui peuvent être utilisées comme cibles pour envoyer des formulaires depuis un contexte donné.</dd>
 <dt>{{CSP("frame-ancestors")}}</dt>
 <dd>Définit les parent valides qui peuvent intégrer une page grâce aux éléments {{HTMLElement("frame")}}, {{HTMLElement("iframe")}}, {{HTMLElement("object")}}, {{HTMLElement("embed")}}, ou {{HTMLElement("applet")}}.</dd>
 <dt>{{CSP("navigate-to")}}{{experimental_inline}}</dt>
 <dd>Restreint les URL vers lesquelles on peut naviguer depuis un document, quel que soit le moyen de navigation (un lien, un formulaire, <code>window.location</code>, <code>window.open</code>, etc.)</dd>
</dl>

<h3 id="Directives_de_rapport">Directives de rapport</h3>

<p>Les directives de rapport permettent de contrôler ce qui se passe lorsqu'une règle CSP est violée. Voir également l'en-tête {{HTTPHeader("Content-Security-Policy-Report-Only")}}.</p>

<dl>
 <dt>{{CSP("report-uri")}}{{deprecated_inline}}</dt>
 <dd>Indique à l'agent utilisateur de rapporter les tentatives d'enfreintes du CSP. Un rapport d'enfreinte est un ensemble de documents JSON envoyés via une requête HTTP <code>POST</code> à l'URI indiquée.</dd>
</dl>

<div class="warning">
<p>Bien que la directive <a href="/fr/docs/Web/HTTP/Headers/Content-Security-Policy/report-to" title="La directive HTTP Content-Security-Policy (CSP) report-to demande à l'agent utilisateur de rapporter les violations de règles CSP à l'adresse fournie dans un groupe de l'en-tête HTTP Report-To."><code>report-to</code></a> est prévue remplacer la directive <code><strong>report-uri</strong></code> maintenant dépréciée, <a href="/fr/docs/Web/HTTP/Headers/Content-Security-Policy/report-to" title="La directive HTTP Content-Security-Policy (CSP) report-to demande à l'agent utilisateur de rapporter les violations de règles CSP à l'adresse fournie dans un groupe de l'en-tête HTTP Report-To."><code>report-to</code></a> n'est pas encore supportée par la plupart des navigateurs modernes. Par rétrocompatibilité avec les navigateurs courants et tout en prévoyant une compatibilité future quand les navigateurs supporteront <a href="/fr/docs/Web/HTTP/Headers/Content-Security-Policy/report-to" title="La directive HTTP Content-Security-Policy (CSP) report-to demande à l'agent utilisateur de rapporter les violations de règles CSP à l'adresse fournie dans un groupe de l'en-tête HTTP Report-To."><code>report-to</code></a>, vous pouvez spécifier les deux directives <code><strong>report-uri</strong></code> et <a href="/fr/docs/Web/HTTP/Headers/Content-Security-Policy/report-to" title="La directive HTTP Content-Security-Policy (CSP) report-to demande à l'agent utilisateur de rapporter les violations de règles CSP à l'adresse fournie dans un groupe de l'en-tête HTTP Report-To."><code>report-to</code></a>:</p>

<pre class="syntaxbox notranslate">Content-Security-Policy: ...; report-uri https://endpoint.com; report-to groupname</pre>

<p>Dans les navigateurs qui supportent <a href="/fr/docs/Web/HTTP/Headers/Content-Security-Policy/report-to" title="La directive HTTP Content-Security-Policy (CSP) report-to demande à l'agent utilisateur de rapporter les violations de règles CSP à l'adresse fournie dans un groupe de l'en-tête HTTP Report-To."><code>report-to</code></a>, la directive <code><strong>report-uri</strong></code> sera ignorée.</p>
</div>

<dl>
 <dt>{{CSP("report-to")}}{{experimental_inline}}</dt>
 <dd>Déclenche un évènement <code>SecurityPolicyViolationEvent</code>.</dd>
</dl>

<h3 id="Autres_directives">Autres directives</h3>

<dl>
 <dt>{{CSP("block-all-mixed-content")}}</dt>
 <dd>Empêche le chargement de toute ressource via HTTP lorsque la page est chargée avec HTTPS.</dd>
 <dt>{{CSP("referrer")}} {{deprecated_inline}}{{non-standard_inline}}</dt>
 <dd>{{HTTPHeader("Referrer-Policy")}} doit être utilisé à la place. Était utilisée pour indiquer l'en-tête référent (sic) pour les liens sortants.</dd>
 <dt>{{CSP("require-sri-for")}}{{experimental_inline}}</dt>
 <dd>Oblige à utiliser le contrôle d'intégrité des sous-ressources ({{Glossary("SRI")}}) pour les scripts ou les styles de la page.</dd>
 <dt>{{CSP("trusted-types")}}{{experimental_inline}}</dt>
 <dd>Utilisée pour spécifier une liste de permissions de règles de <a href="https://w3c.github.io/webappsec-trusted-types/dist/spec/">Trusted Types</a>. Les Trusted Types permettent à des applications de verrouiller les puits d'injection XSS dans le DOM pour n'accepter que des valeurs typées et non falsifiables plutôt que des chaines de caractères.</dd>
 <dt>{{CSP("upgrade-insecure-requests")}}</dt>
 <dd>Indique à l'agent utilisateur de considérer toutes les URL non-sécurisées d'un site (celles servies via HTTP) comme si elles avaient été remplacées par des URL sécurisées. Cette directive est destinée aux sites web qui ont de nombreuses URL historiques non-sécurisées et qui doivent être réécrites.</dd>
</dl>

<h2 id="Utilisation_du_CSP_dans_les_web_workers">Utilisation du <em>CSP</em> dans les <em>web workers</em></h2>

<p>En général, les <em>web workers</em> ne sont pas gérés par les règles de sécurité du contenu du document (ou du <em>worker</em> parent) qui les a créé. Pour indiquer une règle de sécurité du contenu pour le <em>worker</em>, on utilisera un en-tête de réponse <code>Content-Security-Policy</code> pour la requête qui a demandé le script du <em>worker</em>.</p>

<p>Il y a une exception à cette règle lorsque l'origine du script d'un <em>worker</em> est un identifiant global unique (par exemple si l'URL utilise un schéma de donnée ou un blob). Dans ce cas, le <em>worker</em> hérite de la règle de sécurité du contenu depuis le document ou le <em>worker</em> qui l'a créé.</p>

<h2 id="Gérer_plusieurs_politiques_de_sécurité">Gérer plusieurs politiques de sécurité</h2>

<p>Le CSP permet d'indiquer plusieurs règles pour une même ressource avec l'en-tête <code>Content-Security-Policy</code>, l'en-tête {{HTTPHeader("Content-Security-Policy-Report-Only")}} et l'élément {{HTMLElement("meta")}}.</p>

<p>L'en-tête <code>Content-Security-Policy</code> peut être utilisé plus d'une fois comme illustré ci-après. On notera la directive {{CSP("connect-src")}} utilisée ici. Bien que la deuxième règle autorise la connexion, la première contient <code>connect-src 'none'</code>. L'ajout de règles supplémentaires permet uniquement d'augmenter les protections. Les niveaux les plus stricts pour chaque règle sont alors utilisés. Dans l'exemple qui suit, cela signifie que la directive <code>connect-src 'none'</code> sera respectée.</p>

<pre class="notranslate">Content-Security-Policy: default-src 'self' http://example.com;
                         connect-src 'none';
Content-Security-Policy: connect-src http://example.com/;
                         script-src http://example.com/</pre>

<h2 id="Exemples">Exemples</h2>

<h3 id="Exemple_1">Exemple 1</h3>

<p>Dans cet exemple, on désactive les scripts écrits à même le document (<em>inline</em>), les opérations <code>eval()</code> et les ressources (images, polices, scripts, etc.) peuvent uniquement être chargées via HTTPS :</p>

<pre class="notranslate">// en-tête HTTP
Content-Security-Policy: default-src https:

// version avec la balise HTML meta
&lt;meta http-equiv="Content-Security-Policy" content="default-src https:"&gt;
</pre>

<h3 id="Exemple_2">Exemple 2</h3>

<p>Cet exemple est plutôt adapté pour un site historique qui utilise de nombreux scripts écrits dans les documents mais pour lequel on veut s'assurer que les ressources sont chargées via HTTPS et pour lequel on veut désactiver les plugins :</p>

<pre class="notranslate">Content-Security-Policy: default-src https: 'unsafe-eval' 'unsafe-inline'; object-src 'none'</pre>

<h3 id="Exemple_3">Exemple 3</h3>

<p>On ne met pas en place la règle de sécurité mais on récolte les enfreintes qui se seraient produites pour cette règle :</p>

<pre class="notranslate">Content-Security-Policy-Report-Only: default-src https:; report-uri /csp-violation-report-endpoint/</pre>

<p>Pour plus d'exemples, consulter <a href="https://wiki.mozilla.org/Security/Guidelines/Web_Security#Examples_5">les recommandations de Mozilla pour la sécurité web</a>.</p>

<h2 id="Spécifications">Spécifications</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">Spécification</th>
   <th scope="col">État</th>
   <th scope="col">Commentaires</th>
  </tr>
  <tr>
   <td>{{specName("CSP 3.0")}}</td>
   <td>{{Spec2('CSP 3.0')}}</td>
   <td>Ajout de <code>manifest-src</code>, <code>navigation-to</code>, <code>report-to</code>, <code>strict-dynamic</code>, <code>worker-src</code>. <code>frame-src</code> n'est plus déprécié. <code>report-uri</code> est déprécié au profit de <code>report-to</code>.</td>
  </tr>
  <tr>
   <td>{{specName("Mixed Content")}}</td>
   <td>{{Spec2("Mixed Content")}}</td>
   <td>Ajout de <code>block-all-mixed-content</code>.</td>
  </tr>
  <tr>
   <td>{{specName("Subresource Integrity")}}</td>
   <td>{{Spec2("Subresource Integrity")}}</td>
   <td>Ajout de <code>require-sri-for</code>.</td>
  </tr>
  <tr>
   <td>{{specName("Upgrade Insecure Requests")}}</td>
   <td>{{Spec2("Upgrade Insecure Requests")}}</td>
   <td>Ajout de <code>upgrade-insecure-requests</code>.</td>
  </tr>
  <tr>
   <td>{{specName("CSP 1.1")}}</td>
   <td>{{Spec2("CSP 1.1")}}</td>
   <td>Ajout de <code>base-uri</code>, <code>child-src</code>, <code>form-action</code>, <code>frame-ancestors</code>, <code>plugin-types</code>, <code>referrer</code>, <code>reflected-xss</code> et <code>report-uri</code>. Dépréciation de <code>frame-src</code>.</td>
  </tr>
  <tr>
   <td>{{specName("CSP 1.0")}}</td>
   <td>{{Spec2("CSP 1.0")}}</td>
   <td>Définition de <code>connect-src</code>, <code>default-src</code>, <code>font-src</code>, <code>frame-src</code>, <code>img-src</code>, <code>media-src</code>, <code>object-src</code>, report-uri, <code>sandbox</code>, <code>script-src</code> et <code>style-src</code>.</td>
  </tr>
 </tbody>
</table>

<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>

<p>{{Compat("http.headers.csp.Content-Security-Policy")}}</p>

<h2 id="Voir_aussi">Voir aussi</h2>

<ul>
 <li>{{HTTPHeader("Content-Security-Policy-Report-Only")}}</li>
 <li><a href="/fr/Add-ons/WebExtensions/Content_Security_Policy">La sécurité du contenu pour les WebExtensions</a></li>
 <li>
  <p><a href="/fr/docs/Outils/Barre_de_développement/Display_security_and_privacy_policies">Les sécurités pour l'affichage et la confidentialité dans les outils de développement de Firefox</a></p>
 </li>
</ul>