style-src-elem
La directive CSP style-src-elem contrôle les feuilles de style et les blocs style. Chaîne de repli, valeurs, exemples et risques.
Dernière mise à jour:
La directive style-src-elem d'une politique de sécurité du contenu (Content Security Policy, CSP) contrôle quels styles peuvent se charger à travers un bloc <style> ou un élément <link rel="stylesheet">. Elle ne couvre pas les attributs style= inline, ceux-ci relèvent de style-src-attr. Utilisez style-src-elem quand vous voulez que les feuilles de style et les blocs <style> suivent une règle différente de celle des attributs style=.
Une politique minimale sûre pour cette directive, sans 'unsafe-inline':
Content-Security-Policy: style-src-elem 'self' 'nonce-{RANDOM}'Chaîne de repli
style-src-elem se replie sur style-src, puis sur default-src. Si vous ne définissez pas style-src-elem, les feuilles de style et les blocs <style> sont vérifiés contre style-src, et si elle est absente, contre default-src. Définir style-src-elem remplace style-src pour ces éléments.
Comme style-src couvre déjà les feuilles de style et les blocs <style>, la plupart des politiques n'ont pas besoin de style-src-elem. Ne l'utilisez que quand les feuilles de style et les attributs style= inline doivent diverger.
Valeurs
style-src-elem accepte les mêmes types de valeurs que style-src, ou 'none'.
| Valeur | Statut | Description |
|---|---|---|
'none' | ✅ Bon | Bloque toute feuille de style et tout bloc <style>. S'utilise seule. |
'self' | ✅ Bon | Feuilles de style de votre propre origine uniquement. |
| Host source | ✅ Bon | Un host précis comme https://fonts.example.com. |
https: | ✅ Bon | N'importe quelle origine en TLS. Très large pour des styles. |
data: | ❌ Risqué | Les URL data: peuvent transporter des styles contrôlés par un attaquant. |
blob: | ❌ Risqué | Les URL blob: peuvent transporter des styles contrôlés par un attaquant. |
'nonce-...' | ✅ Bon | Correspond à un élément <style> ou <link> portant le même attribut nonce. |
'sha256-...' | ✅ Bon | Empreinte d'un bloc <style> inline exact. |
'report-sample' | ✅ Bon | Ajoute les 40 premiers caractères des styles inline bloqués aux reports. |
'unsafe-inline' | ❌ Risqué | Autorise tout bloc <style> inline, y compris injecté. |
Elle accepte:
- Des sources mots-clés comme
'self'et'unsafe-inline'. - Un nonce ou un hash pour autoriser un bloc
<style>ou une feuille de style<link>précis. - Une host source comme
https://fonts.example.com. - Une scheme source comme
https:.
Un nonce marque un élément <style> ou <link>, et un hash correspond au contenu textuel exact d'un bloc <style> inline. Ajouter l'un ou l'autre fait ignorer 'unsafe-inline'.
Exemples
Autoriser les feuilles de style de même origine et un host de polices, avec un nonce pour un bloc inline:
Content-Security-Policy: style-src-elem 'self' https://fonts.example.com 'nonce-r4nd0m'Usage courant
Une configuration typique autorise votre propre origine et un CDN de polices ou de composants pour les feuilles de style, puis traite les attributs style= séparément avec style-src-attr. Quand un framework injecte des blocs <style> inline, préférez un nonce ou un hash à 'unsafe-inline', voir le guide sur la suppression de unsafe-inline. L'évaluateur CSP indique si style-src-elem dépend encore de 'unsafe-inline'.
Notes de sécurité
style-src-elem bloque les feuilles de style et les blocs <style> injectés qui ne correspondent pas à la liste de sources. Ajouter un nonce ou un hash fait ignorer 'unsafe-inline', ce qui est précisément ce qui empêche un bloc <style> inline injecté de s'appliquer.
'unsafe-inline'autorise tout<style>inline, y compris injecté. Remplacez-le par un nonce ou un hash.- Les blocs
<style>statiques peuvent être hachés avec le générateur de hash.
Contournements et risques connus
Une liste de hosts large laisse des feuilles de style se charger depuis des origines que vous ne contrôlez pas entièrement, et du CSS contrôlé par un attaquant peut servir à des recouvrements de phishing ou à une exfiltration de données par sélecteurs. Gardez la liste serrée.
Une brèche courante consiste à resserrer style-src-elem tout en laissant style-src (ou default-src) permissive pour les attributs style=, qui se résolvent toujours via style-src-attr. Définissez les deux délibérément.
Recommandation
Définissez une règle à base de nonce ou de hash sur style-src et laissez les feuilles de style et les blocs <style> en hériter, sans 'unsafe-inline':
Content-Security-Policy: style-src 'self' 'nonce-{RANDOM}'Un seul style-src couvre tout ce que fait style-src-elem, donc ne prenez style-src-elem que quand les feuilles de style et les attributs style= doivent suivre des règles différentes. Une fois un nonce ou un hash présent, 'unsafe-inline' est de toute façon ignoré, donc il n'y a aucune raison de le garder.
Reporting
Une feuille de style ou un bloc <style> bloqué produit un report csp-violation avec style-src-elem comme directive effective. Ajoutez 'report-sample' pour inclure un court extrait du contenu bloqué. CentralCSP agrège ces reports pour que vous voyiez ce qu'une règle plus stricte casserait.
Prise en charge par les navigateurs
Largement prise en charge par les navigateurs actuels.