fix: recover failed banner cover previews
This commit is contained in:
17
index.tsx
17
index.tsx
@@ -2,6 +2,23 @@ import React from 'react';
|
|||||||
import ReactDOM from 'react-dom/client';
|
import ReactDOM from 'react-dom/client';
|
||||||
import App from './App';
|
import App from './App';
|
||||||
|
|
||||||
|
// Covers uploaded to Bunny Storage are normally served directly by its CDN.
|
||||||
|
// If that CDN URL is unavailable in a browser, retry the safe Academy proxy.
|
||||||
|
// This also protects previews in administrative screens that render native img
|
||||||
|
// elements (for example a homepage-banner preview).
|
||||||
|
document.addEventListener('error', (event) => {
|
||||||
|
const image = event.target;
|
||||||
|
if (!(image instanceof HTMLImageElement) || image.dataset.coverFallbackApplied === 'true') return;
|
||||||
|
try {
|
||||||
|
const filename = new URL(image.currentSrc || image.src, window.location.origin).pathname.split('/').pop() || '';
|
||||||
|
if (!/^[0-9a-f]{8}-[0-9a-f-]{27}\.(?:jpg|png|webp)$/i.test(filename)) return;
|
||||||
|
image.dataset.coverFallbackApplied = 'true';
|
||||||
|
image.src = `${import.meta.env.VITE_API_URL || '/api/v1'}/courses/covers/${filename}`;
|
||||||
|
} catch {
|
||||||
|
// Keep the browser's normal failed-image behavior for non-cover assets.
|
||||||
|
}
|
||||||
|
}, true);
|
||||||
|
|
||||||
const rootElement = document.getElementById('root');
|
const rootElement = document.getElementById('root');
|
||||||
if (!rootElement) {
|
if (!rootElement) {
|
||||||
throw new Error("Could not find root element to mount to");
|
throw new Error("Could not find root element to mount to");
|
||||||
|
|||||||
Reference in New Issue
Block a user