Web: gebroken afbeelding in plaats van logo tijdens het laden #1221

New issue

Closed

opened 2026-08-04 15:21:28 +00:00 by brenno · 0 comments

brenno commented

2026-08-04 15:21:28 +00:00

Owner

Wat er misgaat

Bij het laden van OciDeck op het web verschijnt geen logo, maar een gebroken-afbeelding-icoon op het laadscherm (splash).

Verwacht

Het OciDeck-logo (of niets) op het donkere/lichte laadscherm terwijl de Flutter-engine opstart, met de tekst "OciDeck · Laden… · Loading…".

Waar het zit

De splash in web/index.html verwijst naar het logo met een relatief pad:

<div id="splash" role="status" aria-live="polite">
  <img src="icons/Icon-192.png" alt="" width="72" height="72">
  ...

De bronbestanden bestaan (web/icons/Icon-192.png t/m Icon-512.png, en web/favicon.png), dus het is geen ontbrekend bestand maar een pad-/resolutieprobleem in de gedeployde build. Kandidaten:

<base href="$FLUTTER_BASE_HREF"> staat op de deploy anders dan de map waaronder de webdemo daadwerkelijk wordt geserveerd, waardoor icons/Icon-192.png niet oplost.
De iconen worden niet meegekopieerd naar de deploy-output (controleer build/web/icons/ en scripts/deploy_web.sh).
CSP img-src — onwaarschijnlijk, want 'self' staat toe, maar meenemen bij de diagnose.

Reproductie

Open de gedeployde webdemo (bv. ocideck.librekat.nl).
Let op het laadscherm vóórdat de app klaar is.
In plaats van het logo verschijnt het gebroken-afbeelding-symbool.

Opmerking

Puur cosmetisch tijdens het laden, maar het is het allereerste dat een bezoeker ziet en het oogt kapot. Fix vermoedelijk in web/index.html (relatief pad zónder leidende slash klopt met base-href) en/of scripts/deploy_web.sh (base-href + iconen meekopiëren). Verifieer op de live bron met een curl naar het icoon-pad (moet 200 geven).

## Wat er misgaat Bij het laden van OciDeck op het web verschijnt geen logo, maar een **gebroken-afbeelding-icoon** op het laadscherm (splash). ## Verwacht Het OciDeck-logo (of niets) op het donkere/lichte laadscherm terwijl de Flutter-engine opstart, met de tekst "OciDeck · Laden… · Loading…". ## Waar het zit De splash in `web/index.html` verwijst naar het logo met een relatief pad: ```html <div id="splash" role="status" aria-live="polite"> <img src="icons/Icon-192.png" alt="" width="72" height="72"> ... ``` De bronbestanden bestaan (`web/icons/Icon-192.png` t/m `Icon-512.png`, en `web/favicon.png`), dus het is geen ontbrekend bestand maar een **pad-/resolutieprobleem in de gedeployde build**. Kandidaten: - `<base href="$FLUTTER_BASE_HREF">` staat op de deploy anders dan de map waaronder de webdemo daadwerkelijk wordt geserveerd, waardoor `icons/Icon-192.png` niet oplost. - De iconen worden niet meegekopieerd naar de deploy-output (controleer `build/web/icons/` en `scripts/deploy_web.sh`). - CSP `img-src` — onwaarschijnlijk, want `'self'` staat toe, maar meenemen bij de diagnose. ## Reproductie 1. Open de gedeployde webdemo (bv. `ocideck.librekat.nl`). 2. Let op het laadscherm vóórdat de app klaar is. 3. In plaats van het logo verschijnt het gebroken-afbeelding-symbool. ## Opmerking Puur cosmetisch tijdens het laden, maar het is het allereerste dat een bezoeker ziet en het oogt kapot. Fix vermoedelijk in `web/index.html` (relatief pad zónder leidende slash klopt met base-href) en/of `scripts/deploy_web.sh` (base-href + iconen meekopiëren). Verifieer op de live bron met een `curl` naar het icoon-pad (moet 200 geven).

brenno added the

triage

bug

labels

2026-08-04 15:21:28 +00:00

brenno referenced this issue from a commit

2026-08-04 17:06:25 +00:00

fix(web): hernoem icons/ naar app-icons/ — Apache Alias /icons/ shadowing (#1221)

brenno referenced this issue from a commit

2026-08-04 17:06:25 +00:00

test(web): poort tegen icons/-pad in index.html (Apache shadowing, #1221)

brenno referenced this issue