fix: improve image proxy compatibility with CORS headers and Content-Type fallbacks to resolve broken lightbox images
This commit is contained in:
@@ -67,10 +67,13 @@ export async function GET(request: NextRequest, { params }: { params: Promise<{
|
|||||||
console.log(`[Image API] ✅ Serving ${assetId} (${size}) - Type: ${result.contentType}`);
|
console.log(`[Image API] ✅ Serving ${assetId} (${size}) - Type: ${result.contentType}`);
|
||||||
|
|
||||||
const headers: Record<string, string> = {
|
const headers: Record<string, string> = {
|
||||||
'Content-Type': result.contentType,
|
'Content-Type': result.contentType.includes('application/octet-stream')
|
||||||
|
? 'image/jpeg'
|
||||||
|
: result.contentType,
|
||||||
// Images are immutable once uploaded to Immich — cache aggressively
|
// Images are immutable once uploaded to Immich — cache aggressively
|
||||||
'Cache-Control': 'public, max-age=31536000, immutable',
|
'Cache-Control': 'public, max-age=31536000, immutable',
|
||||||
'X-RateLimit-Remaining': String(remaining),
|
'X-RateLimit-Remaining': String(remaining),
|
||||||
|
'Access-Control-Allow-Origin': '*', // Allow cross-origin for lightbox
|
||||||
};
|
};
|
||||||
|
|
||||||
if (result.contentLength) {
|
if (result.contentLength) {
|
||||||
|
|||||||
@@ -175,6 +175,7 @@ export function Lightbox({ assets, currentIndex, onClose, onNext, onPrev }: Ligh
|
|||||||
src={current.previewUrl}
|
src={current.previewUrl}
|
||||||
alt=""
|
alt=""
|
||||||
draggable={false}
|
draggable={false}
|
||||||
|
crossOrigin="anonymous"
|
||||||
onLoad={() => setImageLoaded(true)}
|
onLoad={() => setImageLoaded(true)}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user