HTML Sanitizer

Bitte beachte, dass sich dieser Artikel nur an die Nutzer eines self-hosted Shops richtet. Für Cloud Shops besteht zum jetzigen Zeitpunkt noch keine Möglichkeit der Umsetzung.

Mit der Shopware Version 6.5 wurde ein HTML Sanitzer implementiert. Dieser Sanitizer verbessert Sicherheit, Zuverlässigkeit und Benutzerfreundlichkeit des Editors, indem unsicherer HTML-Code entfernt wird. Er säubert auch Styles und Attribute für konsistente und korrekte Darstellung des Codes unabhängig von Plattform und Browser.

Wird zum Beispiel der tag img hinzugefügt, so wird dieser nach wenigen Sekunden automatisch vom Editor entfernt und es erscheint ein zusätzlicher Hinweis, dass potenziell gefährlicher Code bereinigt wurde.

Whitelisting

Für alle weiteren Schritte ist ein Grundverständnis für YAML und dessen Syntax notwendig.

Durch einen Workaround bzw. eine Anpassung der Datei z-shopware.yaml ist es möglich, den tag img zum erlaubten Code hinzuzufügen.

Die z-shopware.yaml befindet sich auf dem Server, auf welchem Shopware installiert wurde, unterhalb von config/packages/. Standardmäßig existiert diese Datei nicht. Eine einfache Kopie von der shopware.yaml im selben Verzeichnis löst dieses Hindernis.

In der kopierten shopware.yaml (z-shopware.yaml), innerhalb des shopware: key wird ein weiterer key namens html_sanitizer: benötigt. Innerhalb des keys werden alle weiteren Werte und Wildcards hinzugefügt.

In diesem Beispiel wird der img tag, sowie die CSS-Attribute src, alt und style zur Whitelist hinzugefügt:  

shopware:
    html_sanitizer:
        sets:
            -   name: basic
                tags: [ "img" ]
                attributes: [ "src", "alt", "style" ]
                options:
                    - key: HTML.Trusted
                      value: true
                    - key: CSS.Trusted
                      value: true