Content-Security-Policy : directive style-src-attr
Baseline
Large disponibilité
Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis décembre 2022.
La directive HTTP Content-Security-Policy (CSP) style-src-attr définit les sources valides pour des feuilles de styles appliquées à des éléments individuels du DOM par l'attribut style.
Cette directive ne définit pas les sources valides pour les éléments HTML <style> et les éléments <link> avec rel="stylesheet".
Ces sources sont définies en utilisant style-src-elem (et les sources valides pour tous les styles peuvent être définies avec style-src).
| Version de CSP | 3 |
|---|---|
| Type de directive | Directive de récupération |
Solution de repli default-src |
Oui, si cette directive est absente, l'agent utilisateur consultera la directive style-src, qui a pour valeur par défaut celle de la directive default-src.
|
Syntaxe
Content-Security-Policy: style-src-attr 'none';
Content-Security-Policy: style-src-attr <source-expression-list>;
Cette directive peut avoir l'une des valeurs suivantes :
'none'-
Aucune ressource de ce type ne peut être chargée. Les guillemets simples sont obligatoires.
<source-expression-list>-
Une liste de valeurs d'expressions de source séparées par des espaces. Les ressources de ce type peuvent être chargées si elles correspondent à l'une des expressions de source données. Pour cette directive, les valeurs d'expression de source suivantes sont applicables :
style-src-attr peut être utilisé en conjonction avec style-src:
Content-Security-Policy: style-src <source>;
Content-Security-Policy: style-src-attr <source>;
Exemples
Cas de violation
Soit cet en-tête CSP :
Content-Security-Policy: style-src-attr 'none'
…le style embarqué appliqué à l'élément ci-dessous ne sera pas appliqué :
<div style="display: inline">Foo</div>
La politique bloquera également tous les styles appliqués en JavaScript en définissant directement l'attribut style, ou en définissant cssText :
document.querySelector("div").setAttribute("style", "display: inline");
document.querySelector("div").style.cssText = "display: inline";
Les propriétés de style définies directement sur la propriété style de l'élément ne seront pas bloquées, permettant aux utilisateur·ice·s de manipuler sainement les styles avec JavaScript :
document.querySelector("div").style.display = "inline";
Notez que l'utilisation de JavaScript peut être bloquée indépendamment en utilisant la directive CSP script-src.
Spécifications
| Spécification |
|---|
| Content Security Policy Level 3 # directive-style-src-attr |
Compatibilité des navigateurs
Voir aussi
- L'en-tête
Content-Security-Policy - La directive CSP
style-src - La directive CSP
style-src-elem - L'en-tête
Link - L'élément HTML
<style>,<link> - La règle CSS
@import - La méthode API
CSSStyleSheet.insertRule() - La méthode API
CSSGroupingRule.insertRule() - La propriété API
CSSStyleDeclaration.cssText