Rendering robuster + sichtbare Fehlermeldung + no-cache

- crossOrigin von Asset-Images entfernt (haeufige Ursache fuer "tainted canvas",
  wodurch der Szenen-Export fehlschlug -> kaputtes Bild)
- toBlob mit Fallback auf toDataURL
- Ladefehler werden jetzt sichtbar im UI angezeigt (statt nur Konsole)
- Frontend mit Cache-Control: no-cache -> kein veraltetes JS/CSS nach git pull

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

public/js/app.js

@@ -31,12 +31,30 @@ function showToast(message) {
   showToast._t = setTimeout(() => toast.classList.remove('show'), 900);
 }
 
+function showError(err) {
+  let box = document.getElementById('error-box');
+  if (!box) {
+    box = document.createElement('div');
+    box.id = 'error-box';
+    stage.appendChild(box);
+  }
+  const msg = err && err.message ? err.message : String(err);
+  box.textContent = 'Fehler beim Laden der Szene: ' + msg;
+  box.classList.remove('hidden');
+}
+
+function clearError() {
+  const box = document.getElementById('error-box');
+  if (box) box.classList.add('hidden');
+}
+
 async function loadScene() {
   showLoading(true);
+  clearError();
   winOverlay.classList.add('hidden');
   try {
     const res = await fetch('/api/scene');
-    if (!res.ok) throw new Error('Szene konnte nicht geladen werden.');
+    if (!res.ok) throw new Error('Server-Antwort ' + res.status);
     current = await res.json();
     await scene.render(current);
     scene.resetView();
@@ -44,7 +62,7 @@ async function loadScene() {
     document.getElementById('category-name').textContent = current.category || '';
   } catch (err) {
     console.error(err);
-    showToast('Ups — Szene konnte nicht geladen werden.');
+    showError(err);
   } finally {
     showLoading(false);
   }

public/js/scene.js

@@ -17,7 +17,8 @@ let emojiAssetsAvailable = null; // pro Session: liegt ein Emoji-Bildset vor?
 function loadImage(url) {
   return new Promise((resolve) => {
     const img = new Image();
-    img.crossOrigin = 'anonymous';
+    // Kein crossOrigin: Assets sind same-origin. crossOrigin kann je nach Browser/Proxy
+    // dazu fuehren, dass das Canvas als "tainted" gilt und der Export fehlschlaegt.
     img.onload = () => resolve({ url, img });
     img.onerror = () => resolve({ url, img: null });
     img.src = url;
@@ -155,9 +156,20 @@ export class Scene {
       ctx.restore();
     }
 
-    return await new Promise((resolve) => {
-      canvas.toBlob((blob) => resolve(URL.createObjectURL(blob)), 'image/png');
-    });
+    // Export als Blob-URL; mit Fallback auf dataURL, falls toBlob nicht greift.
+    try {
+      const blob = await new Promise((resolve, reject) => {
+        try {
+          canvas.toBlob((b) => (b ? resolve(b) : reject(new Error('toBlob lieferte null'))), 'image/png');
+        } catch (err) {
+          reject(err);
+        }
+      });
+      return URL.createObjectURL(blob);
+    } catch (err) {
+      console.warn('[scene] toBlob fehlgeschlagen, versuche toDataURL:', err);
+      return canvas.toDataURL('image/png'); // wirft nur, wenn Canvas wirklich "tainted" ist
+    }
   }
 
   _drawItem(ctx, item) {