Bilder im Produkt-Customizer – Grafiken, Produktmockups, Kunden-Uploads und Canvas-Hintergründe – werden möglicherweise nicht geladen oder erscheinen als fehlerhafte Platzhalter. Dies wird in der Regel durch CORS-Einschränkungen, SSL-Probleme oder falsche Dateipfade verursacht.

Symptome

• Grafiken aus der Bibliothek erscheinen als leere oder fehlerhafte Bilder.
• Produkt-Hintergrundbilder erscheinen nicht auf dem Canvas.
• Vom Kunden hochgeladene Bilder werden nicht angezeigt.
• Die Browser-Konsole zeigt CORS- oder Mixed-Content-Fehler.

Ursache 1: CORS-Einschränkungen (Cross-Origin Resource Sharing)

Das Customizer-Canvas benötigt CORS-Header, um Bilder von externen URLs oder CDN-URLs zu laden. Ohne diese Header blockiert der Browser das Bild.

Lösung:

1. Öffnen Sie die Entwicklertools des Browsers (F12 → Konsole).
2. Suchen Sie nach Fehlern, die „CORS" oder „cross-origin" enthalten.
3. Wenn Bilder von einem CDN oder einer anderen Domain bereitgestellt werden, konfigurieren Sie CORS-Header auf diesem Server:
   • Für AWS CloudFront / S3: fügen Sie Access-Control-Allow-Origin: * zur CORS-Konfiguration des Buckets hinzu.
   • Für Cloudflare: stellen Sie sicher, dass CORS-Header nicht entfernt werden.
4. Wenn sich Bilder auf derselben Domain befinden, sollte dies kein Problem sein. Prüfen Sie, dass die Bild-URLs dasselbe Protokoll (https) und dieselbe Domain wie die Website verwenden.

Ursache 2: Mixed Content (HTTP-Bilder auf HTTPS-Website)

Wenn Ihre Website HTTPS verwendet, aber Bild-URLs HTTP verwenden, blockiert der Browser diese als Mixed Content.

Lösung:

1. Prüfen Sie die Browser-Konsole auf „Mixed Content"-Warnungen.
2. Aktualisieren Sie Bild-URLs auf HTTPS:
   • Wenn Sie kürzlich auf HTTPS migriert haben, führen Sie eine Suche-und-Ersetzen-Operation in der Datenbank durch, um http://-URLs auf https:// zu aktualisieren.
   • Verwenden Sie ein Plugin wie Better Search Replace, um URLs in den Chamevo-Produktdaten zu aktualisieren.

Ursache 3: Falsche Dateipfade nach einer Migration

Wenn Sie Ihre Website auf eine neue Domain oder ein neues Verzeichnis verschoben haben, können in Produktkonfigurationen gespeicherte Bildpfade auf den alten Speicherort verweisen.