Seite 1 von 3

[3.3] Hash-Wert in stylesheet.css

Verfasst: 10.08.2020 17:40
von Crizzo
Seit phpBB 3.3.1 wurde in der \styles\prosilver\theme\stylesheet.css ein Hash-Wert zu den importierten Stylesheet-Dateien ergänzt.

Das sieht nun so aus:

Code: Alles auswählen

@import url("normalize.css?hash=48eb3f89");
@import url("base.css?hash=3a7fafb1");
@import url("utilities.css?hash=1034bac8");
@import url("common.css?hash=70bd1301");
@import url("links.css?hash=da040ebb");
@import url("content.css?hash=d7d65e66");
@import url("buttons.css?hash=15c14833");
@import url("cp.css?hash=5cc9ac0c");
@import url("forms.css?hash=18ee8211");
@import url("icons.css?hash=dbc0f3b9");
@import url("colours.css?hash=3b03ccfa");
@import url("responsive.css?hash=438ff202");
Warum wurde das gemacht?
Die bisherige Strategie war, dass man nur beim Einbinden der Stylesheets in HTML-Template einen fortlaufende Nummer ergänzt hat, die beim Löschen des Board-Cache hochgezählt wurde.
Quelltext in prosilver:

Code: Alles auswählen

<link href="{T_STYLESHEET_LINK}" rel="stylesheet">
Ausgabe im Browser:

Code: Alles auswählen

<link href="./styles/prosilver/theme/stylesheet.css?assets_version=102" rel="stylesheet">
So wurden nur nach dem Löschen des Board-Cache die CSS-Dateien neu vom Browser geladen. Dabei kam es bei manchen Browsern dazu, dass die CSS Dateien, der in stylesheet.css importierten CSS-Dateien, trotz Änderungen nicht übernommen wurden und so der Style bis zum Browser Cache löschen defekt war bzw. gerade häufige Besucher noch die alten Stylesheets zu sehen bekamen. Die Hash-Werte in der stylesheet.css innerhalb des @import-Befehls sorgt nun dafür, dass wie bei ?assets_version=102 geänderte Dateien als geändert markiert und von allen Browser frisch geladen werden.

Was ist nun anders?
In der stylesheet.css wird nun im Import-Befehl der Hash-Wert (CRC32 Hash) der jeweiligen Datei ergänzt. Dies wird automatisch beim Bauen der Pakete erstellt. Das erspart den Entwicklern das manuelle Ändern der Werte, was man z. B. durch ein Ergänzen von der Version ?v=3.3.1 gehabt hätte, insbesondere wenn sich CSS-Dateien zwischen den einzelnen Releases nicht ändern.

Was bedeutet das für die Style-Autoren und Benutzer?
Es gibt nun mehrere Optionen, die man als Style-Autor hat:
  1. Ebenfalls einen Hash der einzelnen Datei bilden und dort ergänzen. Den Hash kann z. B. mit 7-zip erstellen (Rechtsklick > CRC SHA > CRC-32) und dort eintragen (siehe Screenshots)
  2. Anstelle von ?hash=438ff202 kann auch jede beliebige alphanumerische Zeichenkette verwendet werden und so kann man z. B. statt: @import url("responsive.css?hash=438ff202"); einfach @import url("responsive.css?v=3.3.1"); oder @import url("responsive.css?v=style1"); schreiben.
  3. Anstelle die stylesheet.css als @import-Datei zu nutzen und nur diese im Kopf der overall_header einzubinden, kann man alle Stylesheet-Dateien direkt einbinden und per ?assets_version={T_ASSETS_VERSION} das Neuladen erzwingen.
  4. Wenn man auf den Bug-Fix verzichten möchte, kann man den Suffix auch einfach weglassen und nur @import url("responsive.css"); schreiben.
Wichtig: Egal ob man Option 1 oder 2 verwendet, der Wert sollte geändert werden, wenn die CSS-Dateien geändert wurden. Ansonsten laden die Browser diese Dateien nicht nach und die Änderungen werden nicht umgesetzt.

Bilder:
Schritt 1:
1. Schritt beim Hash als CRC-32 auslesen.
1. Schritt beim Hash als CRC-32 auslesen.
Schritt 2:
2. Schritt
2. Schritt
hash-wert-auslesen-2.png (4.7 KiB) 4710 mal betrachtet

Re: [3.3] Hash-Wert in stylesheet.css

Verfasst: 10.08.2020 19:21
von Joyce&Luna
Eine Frage dazu, wenn ich nicht diesen Hash nutze sondern irgend eine der anderen Optionen, werden die Styles auf Com zugelassen oder nicht?

Re: [3.3] Hash-Wert in stylesheet.css

Verfasst: 10.08.2020 20:10
von Kirk
Gute Frage, ich denke genaueres können dir nur die Style Validatoren auf .com geben.

Re: [3.3] Hash-Wert in stylesheet.css

Verfasst: 10.08.2020 20:15
von Joyce&Luna
Da könnte Crizzo ja für uns mal nach fragen, er hat ja nun den besseren Kontakt dazu und mein Englisch ist eh grauenhaft.

Ich glaube das aber das die das noch nicht selber wissen was die wollen :grin:

Re: [3.3] Hash-Wert in stylesheet.css

Verfasst: 11.08.2020 07:34
von Dr.Death
Um auf Linux Ebene im Terminal / Konsole einen Hex Hashwert zu ermitteln einfach folgenden Befehl absetzen:

Beispiel: HEX Hashwert für die Datei "base.css" ermitteln:

cksum -o3 base.css | cut -d" " -f1 | awk '{printf "%x\n", $1}'

Ergebnis:
3a7fafb1



(P.S.: Nicht jeder hat die Tools "bc", "crc32" installiert.....)

Re: [3.3] Hash-Wert in stylesheet.css

Verfasst: 11.08.2020 10:34
von Joyce&Luna
Aber kann dieses tun https://www.7-zip.de
Man braucht dann nur mit der rechten Maustaste darauf klicken CRC-SHA wählen und dann CRC32 wählen und macht man auf den Code ein Doppelklick, kann man diesen auch gut kopieren.

Es geht mir nicht darum wie man diesen Hash Code generiert, sondern darum das es für die Style Autoren alles nur erschwert wird.
Wie soll der Support da aussehen?
Von daher möchte ich schon wissen, ob phpbb.com uns da die Freie Wahl lässt dieses zu ändern und die Styles trotzdem validiert.
Sollten sie darauf bestehen, werde ich meine Styles nur noch auf meine Seite anbieten und dann ohne diesen Hash Mist oder zu mindestens vereinfacht.

Re: [3.3] Hash-Wert in stylesheet.css

Verfasst: 11.08.2020 10:49
von Tastenplayer
Joyce&Luna hat geschrieben: 10.08.2020 19:21 Eine Frage dazu, wenn ich nicht diesen Hash nutze sondern irgend eine der anderen Optionen, werden die Styles auf Com zugelassen oder nicht?
Ich denke eher nicht. Validierte Styles müssen die Vorgaben der Stylechanges erfüllen.
Ausserdem habe ich versucht im Blackfog @import url("blackfog.css?v=3.3.1"); und @import url("blackfog.css?v=blacky"); einzugeben. Selbst nach dem Cache leeren zeigt mir die Win10 App das an: 6da46e0d. Also glaube ich nicht, dass mein Style so validiert würde sondern eben nur mit der korrekten Hashcode Zeichenfolge.
Aber schreib einfach PN an Raul, er antwortet immer schnell. Bei mir ist definitiv vorläufig bei 3.2.10 / 3.3.0 (3.3.1-RC1) Schluss!

Echt mühsam wird das Ganze, wenn man einen neuen Style erstellen möchte. Nach jeder Änderung/Anpassung neuer Hahscode einfügen (oder auf keinen Fall mehr mit Firefox arbeiten. Wobei trotz Hashcode aktualisiert Firefox einige Änderungen nicht. Es hängt bei mir von der geänderten Datei ab).

Nebenbei: die Style Validatoren müssten also jetzt bei jedem Style den Hashcode kontrollieren - voll extrem!

Re: [3.3] Hash-Wert in stylesheet.css

Verfasst: 11.08.2020 11:07
von Joyce&Luna
Hi Jutta

Ich glaube nicht das Raul mir das beantworten wird.
Du kannst ihn ja gerne mal fragen, mein Englisch ist eh grauenhaft :D
Sollte es so sein das nur das mit diesem HASH validiert wird, dann werde dann einfach meine Style nur noch auf meiner Seite anbieten ohne diesen HASH.
Welche Win App meinst du?

Re: [3.3] Hash-Wert in stylesheet.css

Verfasst: 11.08.2020 11:13
von Tastenplayer
Gut ich schreibe Raul an.
Entweder Hash Checker oder Hash Tool 1.2 App. Der Hash Checker ist von einer Einzelperson, kann aber nur eine Datei anzeigen. Das Hash Tool 1.2 ist von einer Firma, kann man aber alle css Dateien eines Styles auf einmal anzeigen lassen. Dann nur noch die Zahlen in Dein Stylesheet übertragen und nichts mehr am Style ändern.

Re: [3.3] Hash-Wert in stylesheet.css

Verfasst: 11.08.2020 11:28
von Joyce&Luna
Mit diesem Hash Tool generierst du einen Hash Code, das kannst du mit allen Dateien machen.
Das ist das gleich wie mit 7 zip.

Bin gespannt was Raul sagt.