From 6c7eb348b042c7b65a36f66087ca691d08ef73c1 Mon Sep 17 00:00:00 2001
From: marc <marc@shortcake.local>
Date: Mon, 24 Aug 2026 22:58:19 +0200
Subject: [PATCH] fix(frontend): Ursprung der HoneyOS-Leiste kommt aus der .env
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Die Adresse im <script>-Tag stand fest im Quelltext, waehrend die CSP aus
HONEYBAR_ORIGIN kam. Wer die Leiste woanders betreibt, bekam genau den
Widerspruch: die CSP erlaubte den eigenen Ursprung, geladen wurde der alte.

Beides speist sich jetzt aus derselben Variablen. Ist sie leer, nimmt
vite.config.ts den Tag ganz heraus — sonst bliebe src="/honeybar/honeybar.js"
stehen und der Service Worker beantwortete das mit index.html.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
---
 deploy/.env.example       |  9 +++++----
 deploy/Dockerfile         |  7 +++++--
 deploy/docker-compose.yml |  1 +
 frontend/index.html       | 12 ++++++------
 frontend/vite.config.ts   | 21 +++++++++++++++++++++
 5 files changed, 38 insertions(+), 12 deletions(-)

diff --git a/deploy/.env.example b/deploy/.env.example
index e81f767..257e2e6 100644
--- a/deploy/.env.example
+++ b/deploy/.env.example
@@ -65,11 +65,12 @@ ADMIN_PASSWORD=changeme_strong_admin_password
 # OIDC_BUTTON_LABEL=Anmelden mit PocketID
 
 # ── HoneyOS-Leiste ────────────────────────────────────────────────────────────
-# Ursprung, von dem die Leiste geladen wird. Nimmt ihn in die CSP auf
-# (script-src + connect-src) — ohne das blockt der Browser das Skript.
+# Ursprung, von dem die Leiste geladen wird. Landet an zwei Stellen: beim
+# Bauen im <script>-Tag der index.html, zur Laufzeit in der CSP
+# (script-src + connect-src). Leer = keine Leiste, CSP so eng wie ohne sie.
 #
-# Muss exakt zur Adresse im <script>-Tag der frontend/index.html passen.
-# Leer = keine Leiste, und die CSP bleibt so eng wie ohne sie.
+# Wird beim **Bauen** eingesetzt — nach einer Änderung also
+# `docker compose build app`, ein Neustart genügt nicht.
 HONEYBAR_ORIGIN=https://honeyos.example.com
 # Schlüssel, mit dem sich die Leiste die App-Liste holt. Nötig, weil HoneyOS auf
 # einer anderen Site liegt als Aether und der Browser die HoneyOS-Sitzung dann
diff --git a/deploy/Dockerfile b/deploy/Dockerfile
index 55a242a..d084ab4 100644
--- a/deploy/Dockerfile
+++ b/deploy/Dockerfile
@@ -4,9 +4,12 @@ WORKDIR /app/frontend
 COPY frontend/package*.json ./
 RUN npm ci
 COPY frontend/ ./
-# Schlüssel für die HoneyOS-Leiste. Vite setzt ihn in die index.html ein; leer
-# heisst: die Leiste bekommt keine App-Liste, der Rest bleibt unberührt.
+# Ursprung und Schlüssel für die HoneyOS-Leiste. Vite setzt beides in die
+# index.html ein. Ohne Ursprung faellt der Tag weg (keine Leiste), ohne
+# Schlüssel bekommt die Leiste keine App-Liste — Aether bleibt unberührt.
+ARG HONEYBAR_ORIGIN=""
 ARG HONEYBAR_KEY=""
+ENV VITE_HONEYBAR_ORIGIN=$HONEYBAR_ORIGIN
 ENV VITE_HONEYBAR_KEY=$HONEYBAR_KEY
 RUN npm run build
 
diff --git a/deploy/docker-compose.yml b/deploy/docker-compose.yml
index 41f38ad..ae90009 100644
--- a/deploy/docker-compose.yml
+++ b/deploy/docker-compose.yml
@@ -18,6 +18,7 @@ services:
       dockerfile: deploy/Dockerfile
       args:
         # Wird in die index.html eingebacken, siehe dort.
+        HONEYBAR_ORIGIN: ${HONEYBAR_ORIGIN:-}
         HONEYBAR_KEY: ${HONEYBAR_KEY:-}
     image: gitea.honeyy.duckdns.org/docker/aether:latest
     restart: unless-stopped
diff --git a/frontend/index.html b/frontend/index.html
index ab4c5ca..552f9fc 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -29,17 +29,17 @@
          `defer`: ohne wartet der Seitenaufbau auf das Skript. Ist HoneyOS
          langsam oder aus, darf das Aether nicht ausbremsen.
 
-         Damit der Browser sie überhaupt lädt, muss HONEYBAR_ORIGIN in der .env
-         auf denselben Ursprung zeigen — sonst blockt die CSP.
-
-         data-key kommt aus HONEYBAR_KEY in der .env und wird beim Bauen
-         eingesetzt. HoneyOS liegt auf einer anderen Site als Aether
+         Ursprung und Schlüssel kommen beide aus der .env (HONEYBAR_ORIGIN,
+         HONEYBAR_KEY) und werden beim Bauen eingesetzt. Derselbe Ursprung
+         landet zur Laufzeit in der CSP — so können die beiden nicht
+         auseinanderlaufen. Ist er leer, entfernt vite.config.ts diesen Tag
+         ganz; Aether läuft dann ohne Leiste weiter. HoneyOS liegt auf einer anderen Site als Aether
          (duckdns.org ist ein public suffix), deshalb schickt der Browser die
          HoneyOS-Sitzung nicht mit — ohne diesen zweiten Ausweis bekäme die
          Leiste nie eine App-Liste. Der Schlüssel steht bewusst nicht im
          Quelltext: er käme sonst ins Repo und liesse sich nur mit einer
          Code-Änderung wechseln. -->
-    <script defer src="https://honeyos.duckdns.org/honeybar/honeybar.js"
+    <script defer src="%VITE_HONEYBAR_ORIGIN%/honeybar/honeybar.js"
             data-app="aether" data-key="%VITE_HONEYBAR_KEY%"></script>
   </body>
 </html>
diff --git a/frontend/vite.config.ts b/frontend/vite.config.ts
index 9baceb7..cd0ab3e 100644
--- a/frontend/vite.config.ts
+++ b/frontend/vite.config.ts
@@ -32,9 +32,30 @@ function pdfjsStandardFonts(): Plugin {
   }
 }
 
+/**
+ * Den <script>-Tag der HoneyOS-Leiste entfernen, wenn kein Ursprung gesetzt ist.
+ *
+ * Ohne das bliebe nach der Ersetzung src="/honeybar/honeybar.js" stehen: der
+ * Service Worker beantwortet die Navigation mit index.html, der Browser meldet
+ * einen MIME-Fehler. Kein Ursprung heisst schlicht keine Leiste.
+ */
+function honeybar(): Plugin {
+  return {
+    name: 'aether-honeybar',
+    transformIndexHtml: {
+      order: 'pre',
+      handler(html) {
+        if (process.env.VITE_HONEYBAR_ORIGIN?.trim()) return html
+        return html.replace(/\s*<script[^>]*honeybar\.js[^>]*><\/script>/, '')
+      },
+    },
+  }
+}
+
 export default defineConfig({
   plugins: [
     pdfjsStandardFonts(),
+    honeybar(),
     react(),
     tailwindcss(),
     VitePWA({