CSP: style-src-attr

Die HTTP-Content-Security-Policy (CSP) style-src-attr Direktive gibt gültige Quellen für Inline-Stile an, die auf individuelle DOM-Elemente angewendet werden.

Die Direktive legt keine gültigen Quellen für <style>-Elemente und <link>-Elemente mit rel="stylesheet" fest. Diese werden mit style-src-elem festgelegt (und gültige Quellen für alle Stile können mit style-src festgelegt werden).

CSP-Version 3
Direktivtyp Fetch-Direktive
default-src Fallback

Ja. Wenn diese Direktive fehlt, wird der User-Agent nach der style-src-Direktive suchen, und wenn beide fehlen, auf die default-src Direktive zurückgreifen.

Syntax

http
Content-Security-Policy: style-src-attr 'none';
Content-Security-Policy: style-src-attr <source-expression-list>;

Diese Direktive kann einen der folgenden Werte haben:

'none'

Keine Ressourcen dieses Typs dürfen geladen werden. Die einfachen Anführungszeichen sind obligatorisch.

<source-expression-list>

Eine durch Leerzeichen getrennte Liste von source expression-Werten. Ressourcen dieses Typs dürfen geladen werden, wenn sie mit einem der angegebenen Quellausdrücke übereinstimmen. Für diese Direktive sind die folgenden Quellausdrücke anwendbar:

style-src-attr kann in Verbindung mit style-src verwendet werden:

http
Content-Security-Policy: style-src <source>;
Content-Security-Policy: style-src-attr <source>;

Beispiele

Verletzungsfälle

Angenommen, dieser CSP-Header ist gegeben:

http
Content-Security-Policy: style-src-attr 'none'

… wird der Inline-Stil, der auf das folgende Element angewendet wird, nicht angewendet:

html
<div style="display:none">Foo</div>

Die Richtlinie würde auch alle Stile blockieren, die in JavaScript durch Setzen des style-Attributs direkt oder durch Setzen von cssText angewendet werden:

js
document.querySelector("div").setAttribute("style", "display:none;");
document.querySelector("div").style.cssText = "display:none;";

Stileigenschaften, die direkt auf der style Eigenschaft des Elements gesetzt werden, werden nicht blockiert, was Benutzern ermöglicht, Stile sicher über JavaScript zu manipulieren:

js
document.querySelector("div").style.display = "none";

Beachten Sie, dass die Verwendung von JavaScript möglicherweise unabhängig durch die script-src CSP-Direktive blockiert werden könnte.

Spezifikationen

Specification
Content Security Policy Level 3
# directive-style-src-attr

Browser-Kompatibilität

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
style-src-attr

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support

Siehe auch