diff --git a/IDEAS.md b/IDEAS.md index 598d5b9..ff37ee9 100644 --- a/IDEAS.md +++ b/IDEAS.md @@ -241,6 +241,22 @@ Zu klären, wenn es soweit ist: - **Kein Netz, kein Wetter.** Dann verschwindet das Symbol, statt eine Zahl von gestern als heutige auszugeben. +### Die Leiste ohne `unsafe-inline` + +Fremde Apps bekommen die Leiste über den Reverse Proxy (siehe README). Dabei +muss deren CSP heute `style-src 'unsafe-inline'` erlauben, weil die Leiste ihre +Stile im Shadow DOM mitbringt — ohne das erscheint sie schwarz auf schwarz. +Gemessen am 28.08.2026 an einer nachgebauten fremden App. + +**Auflösbar:** Die Stile als eigene Datei neben `honeybar.js` ausliefern und im +Shadow DOM per `` einbinden. Dann genügt `style-src 'self' https://honeyos…`, +und die CSP der fremden App bleibt streng. Kostet eine zweite Anfrage, die +zwischengespeichert wird. + +Zu prüfen ist dabei, was sonst noch inline gesetzt wird: die Lage der Leiste +selbst und der Innenabstand, den sie der Seite verpasst. Über die CSSOM gesetzte +Stile (`el.style.x = …`) fallen nicht unter die CSP — was im Markup steht, schon. + ### Widgets in der Leiste selbst Bisher sind Widgets als Fenster auf dem Schreibtisch gedacht. Der Schreibtisch diff --git a/README.md b/README.md index d471214..1ce4c7c 100644 --- a/README.md +++ b/README.md @@ -183,6 +183,56 @@ hinein, ihre Stile nicht hinaus. Sie schiebt den Seiteninhalt um 32 px nach unte Vorschau ohne Einbau: `/honeybar/demo.html`. +## Die Leiste in fremde Apps einsetzen (Reverse Proxy) + +Für Werkzeuge, die man **nicht selbst geschrieben hat**, gibt es keinen +`'; +} +``` + +Dazu muss der Ursprung dieser App **in HoneyOS als App eingetragen** sein — die +Liste ist zugleich die CORS-Freigabe. + +**Warum `style-src 'unsafe-inline'`:** Die Leiste bringt ihre Stile mit, im +Shadow DOM. Eine strenge CSP verbietet die — gemessen: die Leiste erscheint, +aber schwarz auf schwarz, ohne Röhre. Das ist eine echte Abschwächung der +CSP dieser App; viele fertige Werkzeuge brauchen `unsafe-inline` ohnehin für +sich selbst, aber wissen sollte man es. (Auflösbar, indem die Leiste ihre Stile +als eigene Datei ausliefert — steht in [IDEAS.md](IDEAS.md).) + +**Was dabei zu erwarten ist:** + +- **Das Layout der fremden App kennt die Leiste nicht.** Rechnet sie mit + `100vh`, wird die Seite um 32 px zu hoch (Bildlaufleiste) — ihr CSS lässt + sich nicht anpassen wie das eigene. Dann hilft `data-push="none"`: Die Leiste + legt sich darüber, statt zu schieben. Verdeckt dafür die oberste Zeile. +- **Apps mit eigener Kopfleiste** sehen doppelt belegt aus. Geschmackssache. +- **Anmeldeseiten, iframes, Downloads** bekommen die Leiste ebenfalls, soweit + sie HTML sind. `sub_filter` unterscheidet das nicht. +- **Andere Proxys:** Caddy braucht ein Zusatzmodul (`replace-response`), + Traefik ein Plugin für den Antwortkörper. nginx kann es ohne Erweiterung. + ## Wer ist wo angemeldet Das Feld **Wer-bin-ich** ist der Pfad, unter dem eine App „wer bin ich" beantwortet